android中WebView的Java与JavaScript交互

android开发中经常使用WebView来加载网页，难免遇到Java与JavaScript的相互调用，记录下来，以便今后查阅。

Java调用JavaScript方法

这个很简单，只需一句代码：

webView.loadUrl("javascript:bb('这是Java调用JavaScript的结果')");

bb是html中的JavaScript的方法名，括号是参数。

JavaScript调用Java方法

在onCreate方法中，添加如下代码：

webView.addJavascriptInterface(this, "obj");

在该Activity中添加一个方法供JavaScript调用：

@JavascriptInterface    public String cc(){        return "这是Java代码返回的结果";    }

注意，`必须得有@JavascriptInterface注解加在方法的前面，否则，不起作用。
然后就可以在JavaScript中调用该Java方法了：

window.obj.cc()

该方法将会返回Java中cc()方法的返回值。
说明：webView.addJavascriptInterface()方法有两个参数，第一个参数是一个类实例，该类里面提供我们要提供给javascript访问的方法；第二个参数是访问我们在类中声明的方法时候所用到的js对象，调用模式为window.obj.方法名()。
下面给出全部的代码，便于大家动手操作：
index.html处于assets中：

<html xmlns="http://www.w3.org/1999/xhtml"><head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title>首页title>    <script type="text/javascript" language="javascript">        function aa(){            alert(window.obj.cc())        }        function bb(text){            alert(text)        }    script>head><body>    <button type="button" onclick="aa()">调用Java代码button>body>html>

MainActivity.java就是主Activity文件了，大家都知道：

import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.webkit.JavascriptInterface;import android.webkit.WebChromeClient;import android.webkit.WebSettings;import android.webkit.WebView;import android.webkit.WebViewClient;public class MainActivity extends AppCompatActivity {    private WebView webView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        webView = (WebView)findViewById(R.id.webView);        WebSettings webSettings = webView.getSettings();        // 设置WebView属性，能够执行Javascript脚本        webSettings.setJavaScriptEnabled(true);        webView.setWebViewClient(new WebViewClient(){            @Override            public boolean shouldOverrideUrlLoading(WebView view, String url) {                view.loadUrl(url);                return true;            }            @Override            public void onPageFinished(WebView view, String url) {                super.onPageFinished(view, url);                webView.loadUrl("javascript:bb('这是Java调用JavaScript的结果')");            }        });        webView.setWebChromeClient(new WebChromeClient() {});        webView.loadUrl("file:///android_asset/index.html");        webView.addJavascriptInterface(this, "obj");    }    @JavascriptInterface    public String cc(){        return "这是Java代码返回的结果";    }}

最后还有一个activity_main.xml布局文件也贴出来：

<?xml version="1.0" encoding="utf-8"?><WebView    xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    android:id="@+id/webView"    tools:context="com.example.webapplication.MainActivity">WebView>

有兴趣的可以试一下，全部代码经过验证，欢迎大家留言，提出问题。

Java调用JavaScript方法

JavaScript调用Java方法

更多相关文章

随机推荐