Android 从 Webview 移除焦点

Question

I have webview content in my webview, it is like a graph;我的 webview 中有 webview 内容，它就像一个图表；

<html>
<head>
    <style type="text/css">
        body {
            font-family: Roboto;
            font-size: 0;
            padding: 0;
            margin: 0;
        }

        #graph {
            width: 100%;
            height: 100%;
        }

        #graph li {
            background: #19bafc;
            display: inline-block;
            margin-left: 6px;
            width: calc(5% - 5.7px);
            height: 100%;
            border-radius: 3px;
        }

        #graph li:first-child {
            margin-left: 0;
        }

        #graph .red-1 {
            background: #fbb75e;
        }

        #graph .red-2 {
            background: #fb8f76;
        }

        #graph .red-3 {
            background: #fa7252;
        }

        #graph li:hover {}

        #graph li .tooltip {
            background: #fff;
            font-size: 12px;
            box-shadow: 0 1px 1px rgba(0,0,0,.04);
            border: 1px solid rgba(0, 0, 0, 0.07);
            padding: 8px;
            border-radius: 3px;
            display: none;
            position: fixed;
            top: calc(50% - 25px);
            left: calc(50% - 78px);
            font-weight: 500;
        }

        #graph li:hover .tooltip {
            display: block;
            opacity: 1 !important;
        }

        #graph li .tooltip .date {
            display: block;
            margin-bottom: 6px;
            color: #97b8c6;
            font-weight: 400;
        }
    </style>
</head>
<body>
    <div>
        <div id="graph">
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>100% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>99% Uptime</div></li>
            <li class="red-1"><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>13% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>98% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>97% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>95% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>98.34% Uptime</div></li>
            <li class="red-2"><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>56% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>34% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>45% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>55% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>100% Uptime</div></li>
            <li class="red-1"><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>34% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>67% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>45% Uptime</div></li>
            <li class="red-2"><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>23% Uptime</div></li>
            <li class="red-3"><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>45% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>35% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>56% Uptime</div></li>
            <li><div class="tooltip"><span class="date">05/03 15.20 / 05.03 15.34</span>76% Uptime</div></li>
        </div>
    </div>
</body>
</html>

I am using a webview;我正在使用 webview；

    <WebView
      android:id="@+id/graph"
      android:layout_width="match_parent"
      android:layout_height="75dp"
      android:layout_marginTop="10dp" />

graph = findViewById(R.id.graph);
graph.loadUrl(URL);

It is working just fine but my problem is this;它工作得很好，但我的问题是这个； when I touch a li on webview, tooltip is showing but even if I click something clickable like a Button or EditText, WebView is not losing hover and tooltip stucks.当我在 webview 上触摸 li 时，会显示工具提示，但即使我单击按钮或 EditText 之类的可点击内容，WebView 也不会丢失 hover 和工具提示。

I read everything about focus but I could not solve my problem.我阅读了所有关于焦点的内容，但我无法解决我的问题。

Answer 1

If I understood your question completely, You should handle focus lost in android and pass it to webview, so webview could be advised and lose focus from element.如果我完全理解您的问题，您应该处理 android 中丢失的焦点并将其传递给 webview，因此可以建议 webview 并从元素中丢失焦点。

To implement this, you should create a jQuery function in your webpage to clear the focus:要实现这一点，您应该在网页中创建 jQuery function 以清除焦点：

    function clear_focus()
{
 $( "body" ).focus();
}

Then wherever you click elements other than webview, for example an editbox.然后，无论您在何处单击 webview 以外的元素，例如编辑框。 It should run this function to run JavaScript function in webview:它应该运行这个 function 来运行 JavaScript function 在 Z5A98E2840FD0141780D784:

myWebView.loadUrl("javascript:clear_focus()");

Android 从 Webview 移除焦点

问题描述

1 个解决方案

解决方案1
1 2021-03-06 19:10:51

Android 从 Webview 移除焦点

问题描述

1 个解决方案

解决方案1 1 2021-03-06 19:10:51

解决方案1
1 2021-03-06 19:10:51