浅谈android和js的交互问题
浅谈android和js的交互问题
现在很多app里面很多功能都用html5实现，也就是用webview加载html显示一些 图文信息。这么做的好处就是减少开发成本 ，一套html在android ，ios及web都可以跑。节省了很多开发成本。但是这个也就带来相应的一些问题。最大问题就是交互问题。所以下面给大家说一下android和js怎么实现交互（android调用js中的方法，js里面调用android的方法）。
一.js调用android
webview设置
//设置编码
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
//支持js
mWebView.getSettings().setJavaScriptEnabled(true);
//设置本地调用对象及其接口
mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");
//载入js
mWebView.loadUrl("file:///android_asset/test.html");方法声明：
class JavaScriptObject {
Context mContxt;
public JavaScriptObject(Context mContxt) {
this.mContxt = mContxt;
}
@JavascriptInterface
public void getAndroidMethod(String name) {
Toast.makeText(mContxt, name, Toast.LENGTH_LONG).show();
}
}html中js调用
<script>
function funFromjs(){
document.getElementById("mydiv").innerHTML="android调用了js的方法";
}
var aTag = document.getElementsByTagName('a')[0];
aTag.addEventListener('click', function(){
//调用android本地方法
myObj.getAndroidMethod("js调用了android的方法！");
return false;
}, false);
</script>测试的test.html放到android的assets目录下面。
二.android调用js
android 调用js 客户端代码：
mWebView.loadUrl("javascript:funFromjs()");funFromjs这个函数 是在html里面的js 声明好的。 大家看上面的代码里面有这个函数。
三.特别注意的地方
总的来说很简单，但是有两点需要特别注意的。
第一点
mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");myObj.getAndroidMethod("js调用了android的方法！");js代码里面的 myObj 不用特殊定义一个对象 ，这个对象是在android webview加载html时候注入的对象，可以认为他们俩就是一个对象。
第二点@JavascriptInterface
大家注意在android 声明出来的方法前面 要加上这个javasriptInterface 注解，否则会报Uncaught TypeError: Object [object Object] has no method... 这个错误。
正常需要判断为 targetSdkVersion>=17时，需要加上@JavascriptInterface，所以target=android-17或更高以便引入高版本android.jar。反之，如果仅targetSdkVersion低于17，那么目标版本不用加@JavascriptInterface，当然加上也行。
所以大家直接加上就可以。
这个交互的demo我已经上传 下载地址
如果大家还有其它问题或者不同意见，可以评论
腾讯云开发者
