Android WebView java和js互相调用

来源：互联网发布：大数据工程师是什么编辑：程序博客网时间：2024/05/01 21:28

js调用java方法

1.先创建一个html文件，将这个文件保存为demo.html，放到asset目录下

<html><script language="javascript">/* This function is invoked by the activity *//* 这个函数被Activity调用的活动 这里的图片我们可以在它的连接里面下载 android_waving.png */                function wave() {                        /* 这里是一个javascript 自定义函数，这是由我们在android的程序里调用的，不在在HTML中调用*/                        document.getElementById("droid").src="android_waving.png";                }        </script>        <body>            <!-- Calls into the javascript interface for the activity -->            <!-- 从HTML文件中调用activity中的函数 -->            <!-- 也就是从HTML到android程序 留意window.demo.clickOnAndroid()这句话 -->            <a onClick="window.demo.clickOnAndroid()"><div style="width:80px;                        margin:0px auto;                        padding:10px;                        text-align:center;                        border:2px solid #202020;" >                                <!-- 图片默认的为 android_normal.png -->                                <img id="droid" src="android_normal.png"/><br>                                Click me!                </div></a>        </body></html>

注意：

<a onClick="window.demo.clickOnAndroid()">

js中并没有demo这个对象，我们也没有在js中定义，这正是我们要做java代码中所要做的工作。

2.java代码

package com.google.android.webviewdemo;import android.app.Activity;import android.os.Bundle;import android.os.Handler;import android.util.Log;import android.webkit.JsResult;import android.webkit.WebChromeClient;import android.webkit.WebSettings;import android.webkit.WebViewpublic class WebViewDemo extends Activity {    private static final String LOG_TAG = "WebViewDemo";    private WebView mWebView;    private Handler mHandler = new Handler();    @Override    public void onCreate(Bundle icicle) {        super.onCreate(icicle);        setContentView(R.layout.main);        mWebView = (WebView) findViewById(R.id.webview);        WebSettings webSettings = mWebView.getSettings();        webSettings.setSavePassword(false);        webSettings.setSaveFormData(false);        // 下面的一句话是必须的，必须要打开javaScript不然所做一切都是徒劳的        webSettings.setJavaScriptEnabled(true);        webSettings.setSupportZoom(false);        mWebView.setWebChromeClient(new MyWebChromeClient());        // 看这里用到了 addJavascriptInterface 这就是我们的重点中的重点        // 我们再看他的DemoJavaScriptInterface这个类。还要这个类一定要在主线程中        mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");        mWebView.loadUrl("file:///android_asset/demo.html");    }    // 这是他定义由 addJavascriptInterface 提供的一个Object    final class DemoJavaScriptInterface {        DemoJavaScriptInterface() {        }        /**         * This is not called on the UI thread. Post a runnable to invoke         * 这不是呼吁界面线程。发表一个运行调用         * loadUrl on the UI thread.         * loadUrl在UI线程。         */        public void clickOnAndroid() {        // 注意这里的名称。它为clickOnAndroid(),注意，注意，严重注意            mHandler.post(new Runnable() {                public void run() {                    // 此处调用 HTML 中的javaScript 函数                    mWebView.loadUrl("javascript:wave()");                }            });        }    }// 线下的代码可以不看，调试用的///////////////////////////////////////////////////////////////////////////////////////////////////    /**     * Provides a hook for calling "alert" from javascript. Useful for     * 从javascript中提供了一个叫“提示框” 。这是很有用的     * debugging your javascript.     *  调试你的javascript。     */    final class MyWebChromeClient extends WebChromeClient {        @Override        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {            Log.d(LOG_TAG, message);            result.confirm();            return true;        }    }}

注意:

webSettings.setJavaScriptEnabled(true);

必须设置webview支持js代码

mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

创建了一个DemoJavaScriptInterface对象，也就是js代码中的demo对象。

为了让WebView从apk文件中加载assets，Android SDK提供了一个schema，前缀为"file:///android_asset/"。WebView遇到这样的schema，就去当前包中的assets目录中找内容。如上面的"file:///android_asset/demo.html"

addJavascriptInterface方法中要绑定的Java对象及方法要运行另外的线程中，不能运行在构造他的线程中，这也是使用Handler的目的。

java调用js方法

相对于js调用java，简单多了，只需要一行代码
mWebView.loadUrl("javascript:wave()");

0 0