webkit中的javascript和android交互
第一步:
在项目中的assets目录中新建text.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function showInfo(content){
document.getElementById("countent").innerHTML=
"这是我的javascript调用. 这是:"+content;
}
</script>
</head>
<body>
<h1>测试</h1><br>
<!--
demo.startPhone(456)是调用android中的方法
demo对应android代码webView.addJavascriptInterface(new JavaObject(), "demo");中的demo
startPhone对应android代码中类JavaObject的startPhone()的方法
-->
<input type="button" onclick="javascript:demo.startPhone(456)" value="显示数据">
<p id="countent">html原始数据</p>
</body>
</html>
第二步:
写MainActivity.java类
package com.su.webkit.activity;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.webkit.WebSettings;
import android.webkit.WebView;
public class MainActivity extends Activity {
private WebView webView;
@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = (WebView)findViewById(R.id.web);
//设置javascript和android的能交互
WebSettings setting=webView.getSettings();
setting.setJavaScriptEnabled(true);
//设置给javascript调用android的方法
webView.addJavascriptInterface(new JavaObject(), "demo");
//加载html
webView.loadUrl("file:///android_asset/text.html");
}
//调用javascript里的方法showInfo();
public void showJavascript(View view){
webView.loadUrl("javascript:showInfo('activity传过来的数据')");
}
class JavaObject{
/*
在javascript调用的方法
*/
public void startPhone(String num){
System.out.println("ad");
Toast.makeText(MainActivity.this,num, Toast.LENGTH_LONG);
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main, menu);
return true;
}
}
第三步:
运行项目