JavaScript在现在的网页设计中用得很多,Android 的WebView可以载入网页,WebView也设计了与JavaScript通信的桥梁。这篇主要介绍一下WebViewk控件如何和JavaScript进行交互。

WebView:

  WebView和网页相关的主要有一下几个方法: 

      setWebViewClient();

      setWebChromeClient();

      addJavascriptInterface();

      loadUrl();

    setWebViewClient():设置一个WebViewClient的对象,通过这个对象的几个回调方法,可以知道当前网页的状态。

    setWebViewChromeClient(): 设置一个WebChromeClient对象,JavaScript调用的一些内建方法都是通过这个对象来处理的。

    addJavascriptInterface(): 设置JavaScript的接口,有两个参数,第一个一般是一个Object对象,里面实现的方法都是网页里JavaScript可以调用到的,第二个参数是一个字符串,最后到JavaScript就相当于一个对象名,JavaScript通过这个对象名调用第一个参数里面实现的方法。要使这个方法生效,要通过WebView的getSettings()方法获取WebSettings对象,设置JavaScript使能 setJavaScriptEnabled(true)。

    loadUrl():载入相应网页。

  下面实现了一个简单的Demo(最后有效果图): 主要的流程是载入了asset目录下的一个内置网页,点击网页上的Click按钮,会调用通过addJavascriptInterface方法设置下去的Object的show()方法,这个方法里通过loadUrl的方式调用JavaScript的javaScriptshow()方法,这个方法里又调用了Java的result()方法,result方法里显示了一个Toast.需要注意的是show()方法的回调和result()方法的回调是不在主线程的。

MainActivity.java

 1 package com.example.administrator.webviewl;
 2
 3 import android.graphics.Bitmap;
 4 import android.os.Handler;
 5 import android.support.v7.app.AppCompatActivity;
 6 import android.os.Bundle;
 7 import android.util.Log;
 8 import android.webkit.JavascriptInterface;
 9 import android.webkit.JsResult;
10 import android.webkit.WebChromeClient;
11 import android.webkit.WebResourceError;
12 import android.webkit.WebResourceRequest;
13 import android.webkit.WebView;
14 import android.webkit.WebViewClient;
15 import android.widget.Toast;
16
17 public class MainActivity extends AppCompatActivity {
18
19     private static final String TAG = "MainActivity.TAG";
20     WebView mWebView;
21     Handler mHander = new Handler();
22     @Override
23     protected void onCreate(Bundle savedInstanceState) {
24         super.onCreate(savedInstanceState);
25         setContentView(R.layout.activity_main);
26         mWebView = (WebView)findViewById(R.id.mWebView);
27         initWebView();
28     }
29
30     public void initWebView() {
31         mWebView.getSettings().setJavaScriptEnabled(true);
32         mWebView.setWebViewClient(new WebViewClientCustom());
33         mWebView.addJavascriptInterface(new Object() {
34             @JavascriptInterface
35             public void result(final String result) {
36                 Log.d(TAG,"javaScript 调用java的方法 返回结果 result = " + result);
37                 mHander.post(new Runnable() {
38                     @Override
39                     public void run() {
40                         if (result.length() > 0) Toast.makeText(MainActivity.this,"你输入了: " + result,Toast.LENGTH_SHORT).show();
41                     }
42                 });
43             }
44             @JavascriptInterface
45             public void show() {
46                 Log.d(TAG,"JavaScript 调用java show()");
47                 mHander.post(new Runnable() {
48                     @Override
49                     public void run() {
50                         Log.d(TAG,"java 调用 javaScript  javaScriptshow()");
51                         mWebView.loadUrl("JavaScript:javaScriptshow()");
52                     }
53                 });
54                 return;
55             }
56         },"JavaScriptL");
57         mWebView.loadUrl("file:///android_asset/index.html");
58     }
59
60     public class WebViewClientCustom  extends WebViewClient {
61         @Override
62         public void onPageStarted(WebView view, String url, Bitmap favicon) {
63             Log.d(TAG,"onPageStarted");
64             super.onPageStarted(view, url, favicon);
65         }
66
67         @Override
68         public void onPageFinished(WebView view, String url) {
69             Log.d(TAG,"onPageFinished");
70             super.onPageFinished(view, url);
71         }
72
73         @Override
74         public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) {
75             Log.d(TAG,"onReceivedError");
76             super.onReceivedError(view, request, error);
77         }
78     }
79 }

View Code

index.html  内置的网页

 1 <!doctype html>
 2 <html lang="en">
 3  <head>
 4   <meta charset="UTF-8">
 5   <meta name="Generator" content="EditPlus®">
 6   <meta name="Author" content="">
 7   <meta name="Keywords" content="">
 8   <meta name="Description" content="">
 9   <title>javaScript</title>
10   <script type="text/javaScript">
11         function javaScriptshow() {
12             var a = document.getElementById("text").value;
13             JavaScriptL.result(a);
14         }
15 </script>
16  </head>
17  <body style="text-align:center;margin-top:100px">
18     <p > Android javaScript学习</p>
19     <form action="">
20          <input type="text" id = "text" value=""/>
21         <input type="button" onclick="window.JavaScriptL.show()" value="Click" />
22     </form>
23  </body>
24 </html>

 

 实现的效果图如下:

  

转载于:https://www.cnblogs.com/xiaojianli/p/5676406.html

Android WebView和JavaScript交互相关推荐

  1. Android WebView与JavaScript交互详解

    近期工作项目中遇到Android的WebView与js交互问题,之前也知道有这方面的技术可以实现.但在用的过程中,却发现还是需要用电心思. 现把我所了解的分享给大家,希望可以帮助到做类似项目的童鞋. ...

  2. Android开发笔记(一百五十一)WebView与JavaScript交互的四种形式

    WebView如果作为简单的网页浏览器,对于一般的浏览行为来说,已经足够了.可做为企业开发者,你的App通常要嵌入自家公司的网页,如此一来,还得考虑App与Web之间的消息传递,这就涉及到App的原生 ...

  3. Android WebView 和 javaScript的互相调用(三)

    原文出处:http://motalks.cn/2016/08/27/Android-WebView-JavaScript-2/ WebView相关阅读 Android WebView 和 javaSc ...

  4. Android WebView 和 javaScript的互相调用(二)

    原文出处:http://blog.csdn.net/wangtingshuai/article/details/8635787 WebView相关阅读 Android WebView 和 javaSc ...

  5. Android WebView 和 javaScript的互相调用(一)

    原文出处:http://blog.csdn.net/wangtingshuai/article/details/8631835 WebView相关阅读 Android WebView 和 javaSc ...

  6. 通过webView与javascript交互来研究webView的特点

    1.前言 webView是android中用于展示简单的网页或者加载一些html格式的很好的选择,它提供了很多的操作上的封装但同时又不失去灵活性,因为他提供了webViewClient和webChro ...

  7. Android WebView 与 JS 交互

    2019独角兽企业重金招聘Python工程师标准>>> 在android activity webView的使用,activity中执行html中的js 方法, 和在html 中 调 ...

  8. Android—WebView与JS交互

    Html文件: WebView与JS交互方式: 1. 前提: WebSettings webSettings = webView.getSettings(); // 设置与Js交互的权限 webSet ...

  9. Android WebView与JS交互入门

    2019独角兽企业重金招聘Python工程师标准>>> 首先在Anndroid代码中对WebView进行初始化 webView = (WebView) findViewById(R. ...

最新文章

  1. 在.NET中实现彩色光标,动画光标和自定义光标
  2. 深度学习框架大PK:TNN决战MNN,ncnn依旧经典
  3. mysql的模糊查询以及时间类型整理
  4. Node.js—简介
  5. C8-2 圆的周长和面积 (100/100 分数)
  6. VBA 网页提取特定内容 - 网抓实践总结
  7. 会员体系架构的设计思路
  8. 微软发布的两个MSF过程指导(Process Guidance)
  9. 4- Mybatis 的参数深入
  10. 给你一个亿-电视节目总结
  11. linux配置MYSQL慢查询的一些错误解决方案
  12. linux mdel 命令详解
  13. heightForRow
  14. editplus配置刷新
  15. java解指派问题,运用Excel规划求解解决指派问题
  16. 工具说明书 - FTDI芯片的USB转UART串口线
  17. 杭州电子科技大学acm--2020
  18. 如何下载并安装Firebug插件
  19. 800-C++ throw(抛出异常)详解
  20. Java设计模式策略模式(附实例代码)每天一学设计模式

热门文章

  1. 微服务架构的常见问题
  2. 查看docker容器日志
  3. 收藏100个网络基础知识
  4. 教你十分钟构建好 SpringBoot + SSM 框架
  5. mysql006添加外键约束
  6. 优衣库不雅_Uniqlo主页-用户体验案例研究
  7. React 18 Beta 来了
  8. mongodb数组字段prefix匹配返回
  9. 基本图形的光栅化算法
  10. 操作Checkbox标签