步骤：
1.设置允许执行JS脚本：
webSettings.setJavaScriptEnabled(true);
2.添加通信接口
webView.addJavascriptInterface(Interface,”InterfaceName”)
3.JS调用Android
InterfaceName.MethodName
4.Android调用JS
webView.loadUrl("javascript:functionName()");
demo:
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private WebView mWebView;
private Button button;
private WebAppInterface appInterface;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button = (Button) findViewById(R.id.button);
button.setOnClickListener(this);
mWebView = (WebView) findViewById(R.id.webview);
mWebView.loadUrl("file:///android_asset/index.html");
mWebView.getSettings().setJavaScriptEnabled(true);
appInterface = new WebAppInterface(this);
mWebView.addJavascriptInterface(appInterface,"app");
}
@Override
public void onClick(View v) {
appInterface.showName("你好呀");
}
class WebAppInterface{
private Context context;
public WebAppInterface(Context ct){
this.context = ct;
}
@JavascriptInterface
public void sayHello(String name){
Toast.makeText(context,"name="+name,Toast.LENGTH_LONG).show();
}
public void showName(final String name){
runOnUiThread(new Runnable() {
@Override
public void run() {
mWebView.loadUrl("javascript:showName('"+name+"')");
}
});
}
}
布局比较简单，一个button和一个webview，就不贴了
html5文件：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5 测试</title>
<style type="text/css">
.input{
width: 90%;
height: 30px;
}
.button{
width: 60%;
height: 20px;
background: #fff;
color: #000
}
</style>
<script type="text/javascript">
function sayhello(){
var name = document.getElementById("txtName").value;
window.app.sayHello(name);
}
function showName(name){
document.getElementById("txtName").value=name;
}
</script>
</head>
<body>
<input id="txtName" class="input" >
<br/>
<hr>
<button class="button" οnclick="sayhello()">say Hello</button>
</body>
</html>
1639
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
