javascript 与 webview 交互

来源:互联网 发布:大数据与实体经济融合 编辑:程序博客网 时间:2024/05/20 20:44

在项目中我碰到需要使用html的js调用android 刷新webview。这里是载入了本地html,需要在html里调用js接口。所以查了下关键代码如下:

public class MyActivity extends Activity {      private WebView Wv;    private TextView myTextView;    final Handler myHandler = new Handler();    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        Wv = (WebView)findViewById(R.id.webView1);        myTextView = (TextView)findViewById(R.id.textView1);        final JavaScriptInterface myJavaScriptInterface                = new JavaScriptInterface(this);        Wv.getSettings().setLightTouchEnabled(true);        Wv.getSettings().setJavaScriptEnabled(true);        Wv.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction");        Wv.loadUrl("file:///android_asset/javascriptTestHtml.html");    }    public class JavaScriptInterface {        Context mContext;        JavaScriptInterface(Context c) {            mContext = c;        }<span style="white-space:pre">@JavascriptInterface </span>        public void showToast(String webMessage){            final String msgeToast = webMessage;            myHandler.post(new Runnable() {                @Override                public void run() {                    // This gets executed on the UI thread so it can safely modify Views                    myTextView.setText(msgeToast);                }            });            Toast.makeText(mContext, webMessage, Toast.LENGTH_SHORT).show();        }    }    }


Html

<!DOCTYPE ><html xmlns="http://www.w3.org/1999/xhtml" debug="true">    <head>        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />        <meta name="viewport"           content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">        <meta name="apple-mobile-web-app-capable" content="yes">        <meta name="viewport" content="target-densitydpi=device-dpi" />       <span style="color:#ff0000;"> <script type="text/javascript">           function init()           {           var testVal = document.getElementById('mytextId').value;           AndroidFunction.showToast(testVal);           }        </script></span>    </head>    <body>                <div style="float: left;width: 50%;">           <input type="text" style="width: 180px;"                    name="myText" id="mytextId" />                   </div>        <div style="clear: both;height: 3px;"> </div>        <div>          <input value="submit" type="button" name="submit"             id="btnSubmit" onclick="javascript:return init();" />         </div>      </body></html>


如果sdk版本是4.2以上需要在方法上加上@JavascriptInterface注入,4.2一下则不需要。

而且需要注意的是,调用方法后不能直接修改androidUI。需要使用handler修改,这就不多说了。


下面是源码地址:


http://download.csdn.net/detail/chinawszjr/8317391


0 0
原创粉丝点击