在 WebView 中注入 JavaScript onclick() 事件答案

【问题标题】：Injecting JavaScript onclick() event inside WebView在 WebView 中注入 JavaScript onclick() 事件
【发布时间】：2013-08-12 13:00:28
【问题描述】：

我有一个 Android 应用，运行一个加载特定页面的 WebView，也是应用的一部分

我想在 WebView 页面中生成一个按钮 onclick() 事件
如何将 JavaScript 文件加载到 Android 资源中的 WebView 页面？

谢谢。

【问题讨论】：

是的，我找到了答案，请在下面找到。但我仍然不知道如何将 JavaScript 文件添加到 Android 资产内的 WebView 页面

标签： javascript android webview android-webview

【解决方案1】：

终于找到答案了……

webView.loadUrl("javascript:(function(){document.getElementById('buttonClick').click();})()");

这里是完整的源代码

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class Huddle extends Activity {
private WebView wv;
EditText editText;
TextView textView;
Button button,buttonClick;

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.main);

    editText = (EditText)findViewById(R.id.titlebar);
    textView = (TextView)findViewById(R.id.txt_html);
    button = (Button)findViewById(R.id.button);
    buttonClick = (Button)findViewById(R.id.buttonClick);

    wv = (WebView) findViewById(R.id.webview);

    wv.getSettings().setJavaScriptEnabled(true);
    wv.getSettings().setUserAgentString("Mozilla/4.0 (compatible; MSIE 5.01; Windows NT 5.0)");
    wv.addJavascriptInterface(new MyJavaScriptInterface(), "HTMLOUT");

    wv.setWebChromeClient(new MyChromeClient());
    wv.loadUrl("file:///android_asset/www/index.html");
    wv.requestFocus();

    button.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            String txt = editText.getText().toString();
            wv.loadUrl("javascript:sayHelloFromJS('"+txt+"')");
        }
    });
    buttonClick.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {

            wv.loadUrl("javascript:(function(){document.getElementById('buttonClick').click();})()");
        }
    });
}

class MyJavaScriptInterface
{
    @SuppressWarnings("unused")
    public void showHTML(final String html)
    {
        runOnUiThread(new Runnable() {
            @Override
            public void run() {
                Huddle.this.textView.setText(html);
            }
        });
    }
}

class MyChromeClient extends WebChromeClient{
}

class MyWebClient extends WebViewClient {
    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);

    }
 }
}

index.html

将此 index.html 添加到 assets\www\index.html

<html>
<script language="JavaScript">
function sayHelloFromJS(value) {
  document.getElementById("namefromAndroid").value =   value;
}

function setHtml(){
  var HTML = ""+document.getElementById("namefromjs").value;
  window.HTMLOUT.showHTML(HTML);
}

function doAlert() {
 alert("JavaScript says: Hello Android !!! How are you?");

}
</script>
</head>
<body>
 <p> Enter your name here <input type="text" id="namefromjs" />
 <p> <input type="button" onclick= "setHtml()" value="Set Name in Android">
 <p> Name from Android is <input type="text" id="namefromAndroid" />

  <p> Button Click <input type="button" value="Click me" id="buttonClick" onclick= "doAlert()" />
</body>
</html>

res\layouts\main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:orientation="vertical"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
    >

<TextView
        android:layout_width="184dp"
        android:layout_height="22dp"
        android:id="@+id/txt_html" android:layout_gravity="left|center_vertical"/>
<EditText
        android:layout_width="161dp"
        android:layout_height="wrap_content"
        android:id="@+id/titlebar" android:layout_gravity="left|center_vertical"/>
<Button
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:text="Add text to web"
        android:id="@+id/button"/>
<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Click Event"
        android:id="@+id/buttonClick" android:layout_gravity="left|center_vertical"/>
<WebView android:id="@+id/webview" android:layout_width="match_parent"
         android:layout_height="match_parent"/>
</LinearLayout>

【讨论】：

不在资产中的远程 url 怎么办
我把这个用于远程 URL，只需更改 URl
所以我们只需要保留 html 文件，我们需要在资产文件夹中单击按钮吗？并执行上述方法获得点击？
是的，请仔细检查函数名称，否则将无法正常工作

【解决方案2】：

这是给 kotlin 的。它适用于 java add (;) line end

wv.loadUrl("javascript:(function() {document.querySelectorAll('.class')[0].click();})()")

【讨论】：