Android中 WebView控件支持JS与本地代码的交互。

// 是否允许在webview中执行javascript

webSettings.setJavaScriptEnabled(true);

//添加JS的接口名称

mWebView.addJavascriptInterface(this, "mobiletojs");

其主要分为两类:

1:JS调用本地代码

通过window.mobiletojs.saveLogin(username, password);

mobiletojs 对应 mWebView.addJavascriptInterface(this, "mobiletojs"); 中的接口名称

2：本地代码调用JS

在Activity中实现方法调用 mWebView.loadUrl("javascript:setUsername('ddd')");   即可实现对JS：设置用户名方法的调用

//Android 本地代码

 package com.whroid.commonapp.ui;

 import android.annotation.SuppressLint;

 import android.app.Activity;

 import android.os.Bundle;

 import android.util.Log;

 import android.webkit.WebSettings;

 import android.webkit.WebView;

 @SuppressLint("JavascriptInterface")

 public class WebViewJSUI extends Activity {

     public static final String TAG = "WebViewJSUI";

     private WebView mWebView;

     @Override

     public void onCreate(Bundle savedInstanceState) {

         super.onCreate(savedInstanceState);

         mWebView = new WebView(this);

         setContentView(mWebView);

         WebSettings webSettings = mWebView.getSettings();

         // 是否允许在webview中执行javascript

         webSettings.setJavaScriptEnabled(true);

         // 为JS添加本地调用的接口 名称

         mWebView.addJavascriptInterface(this, "mobiletojs");

         // 加载网页

         mWebView.loadUrl("file:///android_asset/test_webview_js.html");

     }

     //页面点击登录时 由页面调用

     public void saveLogin(String username,String password)

     {

         Log.w(TAG, "调用登录：onLoin:"+username+" password:"+password);

     }

     //由代码调用页面js,实现对页面的编辑

     public void setUsername()

     {

         mWebView.loadUrl("javascript:setUsername('ddd')");

     }

     public String getUsername()

     {

         return "来自android 的用户名";

     }

     public String getPassword()

     {

         return "mobile password";

     }

 }

//对应的页面，以及相应的JS

 <!DOCTYPE HTML>

 <html>

 <head>

 <meta name="generator"

     content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />

 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

 <title>title</title>

 <script language="javascript">

     function onLogin() {

         var username = document.getElementById("username").value;

         var password = document.getElementById("password").value;

         var userAgent = navigator.userAgent;

         var index = userAgent.indexOf("Android");

         if (index > 0) {

             window.mobiletojs.saveLogin(username, password);

         }

     }

     function setUsername(name) {

         document.getElementById("username").value = name;

     }

     function onInit() {

         var userAgent = navigator.userAgent;

         var index = userAgent.indexOf("Android");

         if (index > 0) {

             //调用android或者ios本地方法，获取用户名或密码

             var username = window.mobiletojs.getUsername();

             var password = window.mobiletojs.getPassword();

             document.getElementById("username").value = username;

             document.getElementById("password").value = password;

         }

     }

     //页面开始加载时，触发

     if (document.readyState == "complete") {

         onInit()

     } else {

         document.onreadystatechange = function() {

             if (document.readyState == "complete") {

                 onInit()

             }

         }

     }

 </script>

 </head>

 <body style="background-color: #ff0;">

     <table width="400" align="center">

         <tr>

             <td><input type="text" value="username" id="username" />

             </td>

             <input type="text" value="password" id="password" />

             <td></td>

         </tr>

         <tr>

             <td>

                 <div id="output">test</div> <input type="submit" value="提交"

                 onclick="onLogin()" /> <br />

                 <table width="400" align="center"></table>

             </td>

         </tr>

     </table>

 </body>

 </html>

Android Webview 与JS交互的更多相关文章

  1. [android] WebView与Js交互

    获取WebView对象 调用WebView对象的getSettings()方法,获取WebSettings对象 调用WebSettings对象的setJavaScriptEnabled()方法,设置j ...

  2. webview与js交互（转）

    原文:http://www.cnblogs.com/vanezkw/archive/2012/07/02/2572799.html 对于android初学者应该都了解webView这个组件.之前我也是 ...

  3. Android中使用WebView与JS交互全解析

    1.概述首先,需要提出一个概念,那就是hybrid,主要意思就是native原生Android和h5混合开发.为什么要这样做呢?大家可以想象一下针对于同一个活动,如果使用纯native的开发方式,An ...

  4. webview与js交互

     对于android初学者应该都了解webView这个组件.之前我也是对其进行了一些简单的了解,但是在一个项目中不得不用webview的时候,发现了webview的强大之处,今天就分享一下使用we ...

  5. android Webview 实现js调用java代码实现Activity跳转

    今天有了一个需求,在android里webview加载的html页面,要求点击html页面的按钮实现Activity的跳转. 咱是是菜鸟,webview的接触不多,于是就和度娘来了次亲密接触.在其中也 ...

  6. webView和js交互

    与 js 交互 OC 调用 JS // 执行 js - (void)webViewDidFinishLoad:(UIWebView *)webView { NSString *title = [web ...

  7. iOS webView与js交互在文本空格上输入文字

    项目要求:webview加载html网址,内容为填空题型文本,需要在横线上添加答案,并点击提交按钮后再将答案进行回显 正常加载的效果图片: 这个是用js交互后的效果图: 点击空格,输入想输入的答案,如 ...

  8. Android原生webview中js交互

    http://www.cnblogs.com/android-blogs/p/4891264.html Html页面和Java代码结合的方式一般用在界面经常被更改 的情况下,可以讲html放在网络中, ...

  9. 【Android开发】Webview 和 JS 交互问题

    一,安卓原生调用JS代码 1,js代码: function handlePasteDataFromApp(pasteStr) { showInfo('pasteData: aaaaa' + JSON. ...

随机推荐

  1. [windows]清除访问共享的用户和密码信息

    方法一: 操作步骤:进入cmd命令界面-->输入:net use(查看列表)-->输入:net use * /delete(清空列表)-->输入:y 回车确认即可. [查看已记录的登 ...

  2. 如何处理错误消息Please install the gcc make perl packages

    如何处理这行错误消息? Please install the gcc make perl packages from your distribution. 执行命令行:yum install gcc ...

  3. 使用ABAP批量下载有道云笔记中的图片

    Jerry喜欢用有道云笔记这款软件做自己的知识管理和知识体系的构建. 当您看到一篇好的有道云笔记分享时,可能会想将其精美的图片下载到本地.作为程序猿,我们不会去手动一张张下载.写个程序帮我们自动下载吧 ...

  4. 11gR2 如何诊断节点重启问题

    本文对如何诊断11gR2 GI环境下的节点重启问题进行了一些介绍. 首先,像10g版本一样,我们首先介绍在GI中能够导致节点重启的进程.1.Ocssd.bin:这个进程的功能和10g版本的功能基本差不 ...

  5. 正确配置Nginx+PHP

    对很多人而言,配置Nginx+PHP无外乎就是搜索一篇教程,然后拷贝粘贴.听上去似乎也没什么问题,可惜实际上网络上很多资料本身年久失修,漏洞百出,如果大家不求甚解,一味的拷贝粘贴,早晚有一天会为此付出 ...

  6. hadoop相关资料集锦

    1 Hadoop集群系列集锦http://www.cnblogs.com/xia520pi/archive/2012/04/08/2437875.html 2 Hadoop和MapReduce详解ht ...

  7. cocos2dx 使用XMLHttpRequest时回调status为0的问题

    今天使用cocos连接http访问时,使用XMLHttpRequest在pc上反问时正常的返回了status=0,但是在android上去返回status是0,看了一下底层代码, 发现status只有 ...

  8. skynet 学习笔记-sproto模块（2）

    云风在skynet中继承了sproto的传输协议,对比protobuf的好处是,能明文看到传输内容,而且skynet不需要protobuf这么功能,所以云风也建议在lua层使用sproto来作为sky ...

  9. CentOS7 中使用 firewall-cmd 控制端口和端口转发

    0X00 firewalld 守护进程 firewall-cmd命令需要firewalld进程处于运行状态.我们可以使用systemctl status/start/stop/restart fire ...

  10. LeetCode935

    问题:935. 骑士拨号器 国际象棋中的骑士可以按下图所示进行移动:  .            这一次,我们将 “骑士” 放在电话拨号盘的任意数字键(如上图所示)上,接下来,骑士将会跳 N-1 步. ...