效果如:
主要用到一个接口类:MyObject
package com.example.jsdemo; import android.content.Context; import android.support.v7.app.AlertDialog; import android.webkit.JavascriptInterface; import android.widget.Toast; public class MyObject { private Context context; public MyObject(Context context) { this.context = context; } //将显示Toast和对话框的方法暴露给JS脚本调用 @JavascriptInterface public void showToast(String name) { Toast.makeText(context, name+"我是后台追加的", Toast.LENGTH_SHORT).show(); } @JavascriptInterface public void showDialog() { new AlertDialog.Builder(context) .setTitle("标题") .setMessage("我是Java不带参").create().show(); } }
MainActivity实现如:
package com.example.jsdemo; import android.os.Bundle; import android.support.v7.app.AppCompatActivity; import android.webkit.WebSettings; import android.webkit.WebView; public class MainActivity extends AppCompatActivity { private WebView wView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); wView = (WebView) findViewById(R.id.wView); wView.loadUrl("file:///android_asset/demo1.html"); WebSettings webSettings = wView.getSettings(); //①设置WebView允许调用js webSettings.setJavaScriptEnabled(true); webSettings.setDefaultTextEncodingName("UTF-8"); //②将object对象暴露给Js,调用addjavascriptInterface wView.addJavascriptInterface(new MyObject(MainActivity.this), "myObj"); } }
然后是main的布局:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent" android:layout_height="fill_parent" tools:context=".MainActivity" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:text="hello_world" android:id="@+id/textView" /> <WebView android:id="@+id/wView" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="5dp" /> </RelativeLayout>
最后是html文件:
<html> <head> <title>Js调用Android</title> </head> <body> <input type="button" value="JS调用Java(带参)" onclick="myObj.showToast('我是Js参数~');"/> <input type="button" value="JS调用Java(不带参)" onclick="myObj.showDialog();"/> </body> </html>
源代码下载