Android中WebView与JS交互

来源：互联网发布：极品五笔2013优化版编辑：程序博客网时间：2024/05/01 19:48

1、基本使用

mWebView = (WebView) findViewById(R.id.content_web_view);mWebView.setWebViewClient(new MyWebViewClient());mWebView.setWebChromeClient(new MyWebChromeClient());          mWebView.loadUrl("file:///android_asset/demo_add_javascript.html");

2、重写Alert

        //重写alert        @Override        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {            Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();            result.confirm();//一定要调用这句            return true;        }

3、Prompt
html文件

<!Doctype html><html>    <script type="text/javascript">        function useAlert() {            alert("alert from javascript!");        }        function usePrompt() {            var result = prompt("prompt from javascript!");            document.getElementById("result").innerText = result;        }    </script>    <body>        this is a test page!        <br/>        <a href="javascript:void" onclick="useAlert()">alert</a><br/>        <a href="javascript:void" onclick="usePrompt()">prompt</a><br/>        <span id="result"></span><br/>    </body></html>

Java代码

        //在前端显示返回值        @Override        public boolean onJsPrompt(WebView view, String url, String message,                                  String defaultValue, JsPromptResult result) {            Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show();            result.confirm(message + " has been shown");            return true;        }

4、addJavaScriptInterface

        //第一个参数，是注入对象实例        //第二参数注入对象的名字        //注入范围，在api17以下注入所有public method ,以上只能注入@Javascript注释的        mWebView.addJavascriptInterface(new AppClient(), "AppClient");

    private class AppClient {        @JavascriptInterface        public int add(int x, int y) {            return x + y;        }        @JavascriptInterface        public String join(String str1, String str2) {            return str1 + str2;        }    }

<!Doctype html><html>    <script type="text/javascript">        window.onload = function() {            var sum = AppClient.add(1, 2);            var str = AppClient.join("Hello", "World");            document.getElementById("result1").innerText = "1 + 2 = " + sum;            document.getElementById("result2").innerText = "Hello + World = " + str;        }    </script><body>    <div id = "result1"></div>    <div id = "result2"></div></body></html>

这里写图片描述

5、Java调用JS
html页面

<html>    <script type="text/javascript">        function writeMessage(message) {            document.body.innerText = message;        }        function getBodyText() {            return document.body.innerText;        }    </script>    <body>        this is origin message    </body></html>

Java代码

    private class MyWebViewClient extends WebViewClient {        @Override        public void onPageFinished(WebView view, String url) {            super.onPageFinished(view, url);            mWebView.loadUrl("javascript:writeMessage('this is message from java')");        }

0 0