2021腾讯云限时秒杀，爆款1核2G云服务器298元/3年！（领取2860元代金券），
地址：https://cloud.tencent.com/act/cps/redirect?redirect=1062
2021阿里云最低价产品入口+领取代金券(老用户3折起)，
入口地址：https://www.aliyun.com/minisite/goods
关于WebView 我们知道目前android市场上的一些应用采用的开发方式大致分为三种：Native App、Web App、Hybrid App。本文主要是Hybrid App中实现的主要技术native组件与js的数据交互的理解以及实现。 Android API中提供了WebView组件来实现对html的渲染。所
最近做android项目中遇到要在webview中做与js交互相关的东东，涉及到js中调用android本地的方法，于是查了资料整理了一下android和js互相调用的过程。如下demo，demo的主要实现过程如下：通过加载本地的html文件（里面有js脚本），实现android本地方法和js中的交互。 第一步： mainfest.xml中加入网络权限 [java] view plain copy print ? <uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.INTERNET" />第二步： 加载本地写好的html文件（定义好js中提供给android调用的方法 funFromjs(),和android提供给js调用的对象接口fun1FromAndroid(String name)）,放在 assets目录下。 [html] view plain copy print ? <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>
<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主题代码： [java] view plain copy print ? @SuppressLint({ "JavascriptInterface", "SetJavaScriptEnabled" })
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化
initViews();
//设置编码
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
//支持js
mWebView.getSettings().setJavaScriptEnabled(true);
//设置背景颜色 透明
mWebView.setBackgroundColor(Color.argb(0, 0, 0, 0));
//设置本地调用对象及其接口
mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");
//载入js
mWebView.loadUrl("file:///android_asset/test.html");
项目要求，在一个网页中跳转Activity，作为一个成长中的小白鼠，我以为实现不了，后台的哥们告诉我可以在H5页面中调用JS实现Activity跳转，经过一天的研究，终于实现了，拿来与大家分享一下 WebView的使用请戳我之前写的博客：http://blog.csdn.net/sinat_164
//点击调用js中方法
mBtn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mWebView.loadUrl("javascript:funFromjs()");
Toast.makeText(mContext, "调用javascript:funFromjs()", Toast.LENGTH_LONG).show();
}
});
}
@SuppressLint({ "JavascriptInterface", "SetJavaScriptEnabled" })
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//初始化
initViews();
//设置编码
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
//支持js
mWebView.getSettings().setJavaScriptEnabled(true);
//设置背景颜色 透明
mWebView.setBackgroundColor(Color.argb(0, 0, 0, 0));
//设置本地调用对象及其接口
mWebView.addJavascriptInterface(new JavaScriptObject(mContext), "myObj");
//载入js
mWebView.loadUrl("file:///android_asset/test.html");
//点击调用js中方法
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对象方法定义 [java] view plain copy print ? public class JavaScriptObject {
Context mContxt;
@JavascriptInterface //sdk17版本以上加上注解
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();
}
}
public class JavaScriptObject {
Context mContxt;
@JavascriptInterface //sdk17版本以上加上注解
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工程
