android webview js 交互

在WebView中使用JavaScript进行交互，加载的网页可以是本地也可以是服务器上的。

前提，将webSettings调用setJavaScriptEnabled(true)，使得本地支持支持js：

WebView webView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);

再者，Android代码要和js交互，JavaScript代码调用Android代码中的方法或者Android代码调用JavaScript代码中的方法，可以在JS和Android代码间绑定一个新的接口，需要调用addJavascriptInterface()方法。
方法参数传入一个Java对象实例和一个字符串，该字符串是一个名字（interface name，注意此接口不是通常所说的用来实现的接口，而是传入的这个对象在JS中的别名），在JS代码中用此名字调用该Java对象的方法。

为了安全考虑，在API 17以后，只有被JavascriptInterface注解标识的公有方法才可以被JS代码访问，注意必须是public方法。

一、JavaScript调用Android代码中方法的例子

1.先定义一个交互的类

public class AndroidForJs {

    private static String TAG = "AndroidForJs";

    private Context context;

    public AndroidForJs(Context context) {
        this.context = context;
    }

    //api17以后，只有public且添加了 @JavascriptInterface 注解的方法才能被调用
    @JavascriptInterface
    public void showToast(String toast) {
        Toast.makeText(context, "调用showToast:" + toast, Toast.LENGTH_SHORT).show();
    }

}

2.将这个类与WebView中的JS代码绑定：

webView.addJavascriptInterface(new AndroidForJs(this),"JavascriptInterface");

这样就创立了一个接口名，叫“JavascriptInterface”，运行在WebView中的JS代码可以通过这个名字调用AndroidForJs类中的showToast()方法

3.JS中的方法实现

二、Android调用JavaScript代码中方法的例子

需要调用的时候只需要一行代码：

webView.loadUrl("javascript:myFunction()");

其中myFunction()是JS函数。

如果JavaScript函数是带参数的，那么调用时要特别注意。

function writeLine(string)
    {
        console.log("Write a new Line");//调试信息
        document.getElementById("content").innerHTML += string + "
";//在content标签段落加入新行
    }

注：其中content是自定义的标签，html中有一个段落是：

   

那么在Android代码中调用这个writeLine()函数时，需要传入一个字符串参数，比如，想要传入一个叫name的String：

webView.loadUrl("javascript:writeLine('"+name+"')");//JS代码要是带参数