javascript 与 webview 交互

最新推荐文章于 2024-06-20 12:06:28 发布

jiarus

最新推荐文章于 2024-06-20 12:06:28 发布

阅读量382

点赞数

分类专栏： android 文章标签： android webview javascript ui 源码

本文链接：https://blog.csdn.net/chinawszjr/article/details/42296009

版权

android 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

在项目中我碰到需要使用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" οnclick="javascript:return init();" /> 
        </div>  
    </body>
</html>

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

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

下面是源码地址：

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