最近做Android项目中遇到要在webview中做与js交互相关的东东,涉及到js中调用android本地的方法,于是查了资料整理了一下android和js互相调用的过程。如下demo,demo的主要实现过程如下:通过加载本地的html文件(里面有js脚本),实现android本地方法和js中的交互。
第一步:
mainfest.xml中加入网络权限
-
<uses-permission android:name="android.permission.INTERNET" />
第二步:
加载本地写好的html文件(定义好js中提供给android调用的方法 funFromjs(),和android提供给js调用的对象接口fun1FromAndroid(String name)),放在 assets目录下。
-
<body>
-
<a>js中调用本地方法</a>
-
<script>
-
-
function funFromjs(){
-
document.getElementById("helloweb").innerHTML="HelloWebView,i'm from js";
-
}
-
var aTag = document.getElementsByTagName('a')[0];
-
aTag.addEventListener('click', function(){
-
//调用android本地方法
-
myObj.fun1FromAndroid("调用android本地方法fun1FromAndroid(String name)!!");
-
return false;
-
}, false);
-
</script>
-
<p></p>
-
<div id="helloweb">
-
-
</div>
-
</body>
第三步:
实现android工程与js交互的相关代码
android主题代码:
-
@SuppressLint({ "JavascriptInterface", "SetJavaScriptEnabled" })
-
@Override
-
protected void onCreate(Bundle savedInstanceState) {
-
super.onCreate(savedInstanceState);
-
setContentView(R.layout.activity_main);
-
-
initViews();
-
-
-
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
-
-
mWebView.getSettings().setJavaScriptEnabled(true);
-
-
mWebView.setBackgroundColor(Color.argb(0, 0, 0, 0));
-
-
mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");
-
-
mWebView.loadUrl("file:///android_asset/test.html");
-
-
-
mBtn1.setOnClickListener(new View.OnClickListener() {
-
-
@Override
-
public void onClick(View v) {
-
mWebView.loadUrl("javascript:funFromjs()");
-
Toast.makeText(mContext, "调用javascript:funFromjs()", Toast.LENGTH_LONG).show();
-
}
-
});
-
-
}
js调用的android对象方法定义
-
public class JavaScriptObject {
-
Context mContxt;
-
@JavascriptInterface
-
public JavaScriptObject(Context mContxt) {
-
this.mContxt = mContxt;
-
}
-
-
public void fun1FromAndroid(String name) {
-
Toast.makeText(mContxt, name, Toast.LENGTH_LONG).show();
-
}
-
-
public void fun2(String name) {
-
Toast.makeText(mContxt, "调用fun2:" + name, Toast.LENGTH_SHORT).show();
-
}
-
}
效果图:
。。。。
ps:据网友反应,在Android4.4以上不支持js的一些方法了,上面的思想大概是这样,要实用的大家可以参考这个开源项目:
https://github.com/lzyzsd/JsBridge
点击去下载整个demo工程