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

android 与html交互java调js与js调java操作

2016-04-19 20:51 344 查看

1.首先在项目下建一个assets目录(右击app->New->Folder->Assets Flolder)，直接放在项目根目录下和res目录同级别（把所html，js,图片,css等所有网页相关放在这个目录下）r

2.建一个test.html文件代码如下

<html>

<script>
function callJS(arg){
document.getElementById('replaceme').innerHTML=arg;
alert("arg="+arg);
} //Android后台java会来调用它
</script>
<body>
<a href="#"  onclick="window.alert('AlertfromJavaScript')">
alert调用toast</a><br>

<a href="#" onclick="window.android.callAndroid('HellofromBrowser')">
js调用java方法</a><br>
<a href="#" onclick="window.android.callAndroid222('HellofromBrowser2222','333')">
js调用java方法2</a>
<!--//js通过自己定义“android"接口来调用java类中的方法，"android"可以改成任意的，但必须和java中设置的接口名一致-->
<br />
<p id="replaceme">
</p>
<body>
</html>

3.layout文件如下

<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/webView"
android:layout_below="@+id/btnUrlShow" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="java调用js方法"
android:id="@+id/bt4"
android:layout_below="@+id/bt3"
android:layout_alignLeft="@+id/bt3"
android:layout_alignStart="@+id/bt3" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="用来显示html调用的值"
android:id="@+id/textView5"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"/>

4.activity代码如下

public class WebViewActivity extends Activity  {
private Button sendRequest,bt4;
private TextView responseText,textView5;

private final Handler handler=new Handler();//只有用handel才能修改android控件的值
private class AndroidBridge //这个类中提供各种js可调用的方法。
{
@JavascriptInterface
public void callAndroid(final String arg)
{
handler.post(new Runnable(){
public void run()
{
Log.d("ZW", "calAndroid("+arg+")");
textView5.setText(arg);
}
});
}

@JavascriptInterface
public void callAndroid222(final String arg,final  String arg2)
{
handler.post(new Runnable(){
public void run()
{
Log.d("zwzw", "callAndroid222("+arg+","+arg2+")");
textView5.setText(arg);
}
});
}
}

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
textView5=(TextView)findViewById(R.id.textView5);

webView = (WebView) findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true);//让web可以运行js
String url="file:///android_asset/test.html";
webView.loadUrl(url);

webView.addJavascriptInterface(new AndroidBridge(), "android"); //将那个实例化的函数类设置为”android"的js接口这个。这里什么android名字前台js调用就用什么,比如这这里给名字为abc,html中调用就用onclick="window.abc.callAndroid(...."

//覆盖重写html中js的alert方法,还可以覆盖重写别的方法，可以转到定义去查。。
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsAlert(WebView view, String url, String message, JsResult result) {

Log.d("ZW", "onJsAlert(" + view + "," + url + "," + message + "," + result + ")");
Toast.makeText(WebViewActivity.this, message, Toast.LENGTH_SHORT).show();
result.confirm();
return true;
}

});//设置可以被java截获的js事件。

//点android控件调用js方法
　　　　 bt4=(Button)findViewById(R.id.bt4);

bt4.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
Log.d("ZW", "onClick(" + v + ")");
webView.loadUrl("javascript:callJS('hello from android')");  //java调用js的函数
}
});
}
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航