Android(安卓)WebView中javascript和java的互相调用

在Android的WebView中我们可以实现Java代码和javascript代码的互相调用，下面用一个demo说明：

1、首先是布局文件，比较简单，上面一个Button，下面一个WebView，这个就不上xml代码了

2、然后是html文件，这里测试用的是写好的html文件，放在Android工程的assets目录下，命名为test.html，其内容为：

<script language='javascript'><!-- 该方法是被Java代码调用的 -->function test(){alert('my name is yubo');}<!-- 该方法最后将调用Java代码中的showToast()方法 -->function btnclick(){client.showToast();}</script><!-- html显示文本 -->hello, world!<br/><!-- html显示按钮 --><input type="button" value="show toast" onclick="btnclick()"/>

在Activity中，主要代码如下：

package com.example.testjs;import android.os.Bundle;import android.annotation.SuppressLint;import android.app.Activity;import android.view.View;import android.webkit.WebChromeClient;import android.webkit.WebView;import android.widget.Toast;@SuppressLint("SetJavaScriptEnabled")public class MainActivity extends Activity {private WebView webView;    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);                webView = (WebView) findViewById(R.id.webview);        //设置WebView支持javascript        webView.getSettings().setJavaScriptEnabled(true);        //让WebView加载本地html文件        webView.loadUrl("file:///android_asset/test.html");        webView.setWebChromeClient(new WebChromeClient());        //设置WebView的js接口，通过此处的设置，让js可以调用Java代码        webView.addJavascriptInterface(this, "client");    }        //这是Activity中显示的按钮的点击事件，测试通过Java调用js方法    public void btnClick(View view){    webView.loadUrl("javascript:test()");    }        //这是将会被js调用的Java方法，当html文件中的按钮被点击时执行该方法    public void showToast(){    Toast.makeText(this, "this function is called by js", Toast.LENGTH_SHORT).show();    }}

程序运行时的界面如下：

当点击页面上方的show alert按钮时，会调用js中的方法，执行结果如下图：

当点击WebView中的show toast按钮时，将会通过js代码调用Activity中的showToast()方法，显示一个Toast，执行结果如下图：

更多相关文章

随机推荐