您的位置:首页 > 移动开发 > Android开发

android与js的交互

2016-04-11 15:50 411 查看
(0)写一个简单测试html

<!DOCTYPE html>
<html>
<head>
<title>app与web交互</title>
</head>
<body>
<script type="text/javascript">
function changText() {//本方法实现更换h1内容
document.getElementById("demo").innerHTML="调用javascript方法";
}
</script>
<h1 id='demo'>hello world</h1>

<!-- 调用android方法的按钮 -->
<button onclick="window.android.show()" >调用android方法</button>

</body>
</html>


(1)android调用js方法

添加mWebView.getSettings().setJavaScriptEnabled(true);使webView支持javascript

mWebView.getSettings().setJavaScriptEnabled(true);
findViewById(R.id.id_btn).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mWebView.loadUrl("javascript:changText()");//changText()是网页的js方法
}
});


(2)js调用android方法

1. 写一个类UserJs,定义方法show;注意一点要为show方法添加注解@JavascriptInterface

private class UserJs {

@JavascriptInterface
public void show(){

Log.e("czhongzhi","网页调用本地方法");
Toast.makeText(MainActivity.this,"网页调用本地方法",Toast.LENGTH_SHORT).show();
}
}


2. webView添加js调用接口;

mWebView.addJavascriptInterface(new UserJs(),"android");


3. html调用方法window.android.show(),其中android是第二步定义接口名称

<button onclick="window.android.show()" >调用android方法</button>


完整代码:

public class MainActivity extends Activity {

private WebView mWebView;

private String url = "http://192.168.1.42/html5/index.html";

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

mWebView = (WebView) findViewById(R.id.id_webview);

WebSettings settings = mWebView.getSettings();
settings.setUseWideViewPort(true);
settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

mWebView.loadUrl(url);

mWebView.getSettings().setJavaScriptEnabled(true);
findViewById(R.id.id_btn).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mWebView.loadUrl("javascript:changText()");//changText()是网页的js方法
}
});

mWebView.addJavascriptInterface(new UserJs(),"android");

}

private class UserJs {

@JavascriptInterface
public void show(){

Log.e("czhongzhi","网页调用本地方法");
Toast.makeText(MainActivity.this,"网页调用本地方法",Toast.LENGTH_SHORT).show();
}
}

@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()){
mWebView.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: