Android WebView的使用并与JS交互

Android要与js交互肯定必须借助Android的控件WebView，WebView控件用来加载一个html，我们的js代码写在html中。

WebView使用

首先我们来看WebView控件怎么使用。

webview = (WebView) findViewById(R.id.shop_webview);

接着我们要进行一些设置

webview.getSettings().setUseWideViewPort(true); // 设置加载进来的页面自适应手机屏幕（可缩放）
webview.getSettings().setLoadWithOverviewMode(true);

webview.setWebViewClient(client);//WebViewClient主要帮助WebView处理各种通知、请求事件的
webview.setWebChromeClient(wvcc);//WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等
webview.getSettings().setJavaScriptEnabled(true);允许JavaScript
webview.loadUrl(url);//加载url

WebViewClient

    private WebViewClient client = new WebViewClient() {
        public void onPageStarted(WebView view, String url, android.graphics.Bitmap favicon) {
        };

        public void onPageFinished(WebView view, String url) {

        };
    };

WebChromeClient

平常非常常见的进度条就可以在这里写了

 private WebChromeClient wvcc = new WebChromeClient() {  
         @Override  
         public void onReceivedTitle(WebView view, String title) {  
             super.onReceivedTitle(view, title);  
         }  

         public void onProgressChanged(WebView view, int newProgress) {
             progressBar.setProgress(newProgress);
             if(newProgress >= 100){
                 progressBar.setVisibility(View.GONE);
             }
         };
     }; 

这样呢我们WebView基本就可以用来做很多事情了

---

接下来呢，就是和JS的交互了

与JS交互

怎么交互呢？所谓交互就是互相调用方法啦，首先我们来看：

JS调用java方法

首先要对webview绑定javascriptInterface，js脚本通过这个接口来调用java代码。
那我们提供一个javascriptInterface吧，注意添加注解哦

public class JsInteration{
        @JavascriptInterface
        public void function(){
            L.d("我被调用了哦");
        }
    }

然后呢给WebView绑定上它

webview.addJavascriptInterface(new JsInteration(), "demo");

ok，到这我们Android端的java代码就完成了，下面看js怎么调用这个function

<a onClick="window.demo.function()">点击调用java代码</a> 

ok,就是这么简单
当然我们有更复杂的，那就是传递参数了，依然简单

public class JsInteration{
        @JavascriptInterface
        public void function(String[] urls,int index){
            L.d(Arrays.toString(urls));
            L.d(intdex+"");
        }
    }

那js直接就传参数就行了，就不贴代码了
这样我们js调用Android的java代码就介绍完了，下面我们介绍：

Android 调用JS

这个更简单，只需要调用WebView的loadUrl方法即可,当然也可以传递参数：

webView.loadUrl("javascript:javacalljs()");//没有参数
webView.loadUrl("javascript:javacalljswith(" + "'hello'" + ")"); //有参数

下面贴出js代码：

<script type="text/javascript">  
function javacalljs(){  
     document.getElementById("content").innerHTML +=     
         "<br\>java调用了js函数";  
}  

function javacalljswith(arg){  
     document.getElementById("content").innerHTML +=     
         ("<br\>"+arg);  
}  
</script>

好，我们的Android与js交互就完成了，这里只是简单的demo，我们可以实现更加丰富的内容

GoodLuck!