Android WebView JavaScript交互

今天介绍一下，Android中Webview与JavaScript的交互，首先是在布局文件里添加webview控件：

[html] view plaincopy

1. <WebView
2. android:id="@+id/webview"
3. android:layout_width="fill_parent"
4. android:layout_height="fill_parent" />

然后是在manifest里添加权限：

[html] view plaincopy

1. <uses-permission android:name="and

要是webview能够与JavaScript交互，首先需要webview要启用JavaScript：

[html] view plaincopy

1. WebSettings webSettings = myWebView.getSettings();
2. webSettings.setJavaScriptEnabled(true);

然后创建JavaScript的接口：

[java] view plaincopy

1. public class WebAppInterface {
2. Context mContext;
3. /** Instantiate the interface and set the context */
4. WebAppInterface(Context c) {
5. mContext = c;
6. }
7. /** Show a toast from the web page */
8. @JavascriptInterface
9. public void showToast(String toast) {
10. Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
11. }
12. }

给webview添加JavaScript接口：

[html] view plaincopy

1. myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");

本地JavaScript文件：

[javascript] view plaincopy

1. <input type="button" value="Say hello" onClick="showAndroidToast(‘Hello Android!‘)" />
2. <script type="text/javascript">
3. function showAndroidToast(toast) {
4. Android.showToast(toast);
5. }
6. </script>

整个代码如下：

[java] view plaincopy

1. public class MainActivity extends Activity {
2. private WebView myWebView;
3. @Override
4. protected void onCreate(Bundle savedInstanceState) {
5. super.onCreate(savedInstanceState);
6. setContentView(R.layout.activity_main);
7. myWebView = (WebView) findViewById(R.id.webview);
8. WebSettings webSettings = myWebView.getSettings();
9. webSettings.setJavaScriptEnabled(true);
10. myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
11. ProcessWebString();
12. }
13. public class WebAppInterface {
14. Context mContext;
15. /** Instantiate the interface and set the context */
16. WebAppInterface(Context c) {
17. mContext = c;
18. }
19. /** Show a toast from the web page */
20. @JavascriptInterface
21. public void showToast(String toast) {
22. Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
23. }
24. }
25. private void ProcessWebString() {
26. // 加载 asset 文件
27. String tpl = getFromAssets("web_tpl.html");
28. myWebView.loadDataWithBaseURL(null, tpl, "text/html", "utf-8", null);
29. }
30. /*
31. * 获取html文件
32. */
33. public String getFromAssets(String fileName) {
34. try {
35. InputStreamReader inputReader = new InputStreamReader(
36. getResources().getAssets().open(fileName));
37. BufferedReader bufReader = new BufferedReader(inputReader);
38. String line = "";
39. String Result = "";
40. while ((line = bufReader.readLine()) != null)
41. Result += line;
42. return Result;
43. } catch (Exception e) {
44. e.printStackTrace();
45. }
46. return "";
47. }
48. }

运行效果：