随着前端技术的发展与H5的广泛使用，移动端采用native+h5的方式越来越多了，对于Android来说就涉及到java与js的交互，相互调用传参等。下面就来看一下java与js交互的简单demo。

方式

实现js调用java有四种方式：

1.JavascriptInterface

2.WebViewClient.shouldOverrideUrlLoading()

3.WebChromeClient.onConsoleMessage()

4.WebChromeClient.onJsPrompt()

    JavascriptInterface

    这种方式是Android官方提供的Javascript与Native通信的解决方案。

        java中创建接口

        public class DemoInteface {

            @android.webkit.JavascriptInterface

            public void fromJs(String toast) {

                Toast.makeText(MainActivity.this, toast, Toast.LENGTH_SHORT).show();

            }

        }

        将接口添加到WebView中

        webView = (WebView) findViewById(R.id.wb);

        WebSettings settings = webView.getSettings();

        settings.setJavaScriptEnabled(true);

        webView.loadUrl("file:///android_asset/test.html");

        webView.addJavascriptInterface(new DemoInteface(), "demo");

        将接口添加到WebView中

        <body>

            <a href="javascript:;" class="m-btn" onclick="showToast('js的问候送达')">Toast</a>

            <script language="javascript">

                function showToast(toast) {

                    javascript:demo.fromJs(toast);

                };

            </script>

        </body>

        注意js中的javascript:demo.fromJs(toast); 其中类名（dmeo）要与 webView.addJavascriptInterface(new DemoInteface(), “demo”);中第二个参数一致，方法名要与接口中方法的名称一致

        

    WebViewClient.shouldOverrideUrlLoading()

    这个方法是拦截webview中所有的url跳转，根据url来判断是否拦截，来执行不同的操作

    java代码

    public class CustomWebViewClient extends WebViewClient {

            @Override

            public boolean shouldOverrideUrlLoading(WebView view, String url) {

                if (url.contains("toast")) {

                    Log.e("yue", url);

                    Toast.makeText(MainActivity.this, "拦截成功了", Toast.LENGTH_SHORT).show();

                    return true;

                }

                return super.shouldOverrideUrlLoading(view, url);

            }

       }

    webView.setWebViewClient(new CustomWebViewClient());

    js代码

    <a href="https://www.baidu.com/?=toast" class="m-btn">Toast2</a>

        1

    

    WebChromeClient.onConsoleMessage()

    这是Android提供给Javascript调试在Native代码里面打印日志信息的API。

    java

    public class CustomWebChromeClient extends WebChromeClient {

            @Override

            public boolean onConsoleMessage(ConsoleMessage consoleMessage) {

                super.onConsoleMessage(consoleMessage);

                String msg = consoleMessage.message();//Javascript输入的Log内容

                Log.d("fromjs",msg);

                return true;

            }

      }

    webView.setWebChromeClient(new CustomWebChromeClient());

    js代码

    <a href="javascript:;" class="m-btn" onclick="log()">log</a>

    function log(){

        console.log('log info from js');

    }

    

    WebChromeClient.onJsPrompt()

    除了WebChromeClient.onJsPrompt()，还有WebChromeClient.onJsAlert()和WebChromeClient.onJsConfirm()。顾名思义，这三个Javascript给Native代码的回调接口的作用分别是提示展示提示信息，展示警告信息和展示确认信息。因为极少会用这几种，所以这里就不多做介绍

实现java调用js：

上面说了js调用java有很多方式，常用也是官方推荐的就是前两种，而java调用js就只有一种方式，WebView.loadUrl()，androi 4.4（api 19）以上出现了WebView.evaluateJavascript()来代替loadUrl。

java代码

 button.setOnClickListener(new View.OnClickListener() {

     @Override

      public void onClick(View v) {

          if (android.os.Build.VERSION.SDK_INT >= 19) {

              webView.evaluateJavascript("javascript:wave()", null);

          } else {

              webView.loadUrl("javascript:wave('')");

          }

      }

  });

js代码

 var flag = false;

 function wave() {

     if(!flag){

         flag = true;

         document.getElementById("droid").src="testb.png";

     }else{

         flag = false;

         document.getElementById("droid").src="testa.png";

     }

 }





以上就是一些简单的js与java的交互。要想实现复杂的交互逻辑，可以使用jsBridge这一第三方框架，吓篇博客讲会介绍这一框架的使用及原理。

代码下载： http://download.csdn.net/detail/qq_27942511/9832172

java与js交互，相互调用传参的更多相关文章

  1. gwt中java与js的相互调用

    1. java通过jsni调用内部js Button button = new Button("java调用内部jsni的js方法"); button.addClickHandle ...

  2. Android与JS交互，json传参问题

    一.JS调用Android的方法 JS调用安卓的方法,并且传递的参数为json格式的字符串(JSONObject.toString()), 例如: var json = {"name&quo ...

  3. Java项目导出为jar包+导出第三方jar包+使用命令行调用+传参

    Java项目导出为jar包+导出第三方jar包+使用命令行调用+传参 一.打包 情况1:不需要向程序传参数,并且程序没有使用第三方jar包 Eclipse上导出jar: 然后选择一个java文件作为入 ...

  4. Android WebView加载本地html并实现Java与JS交互

    最近做的一个项目中,用到自定义地图,将自定义地图转换成html页面,现在需要做的是如何将本地的html加载到android中,并可以实现交互. 相关讲解: 其实webview加载资源的速度并不慢,但是 ...

  5. JAVA与.NET的相互调用——通过Web服务实现相互调用

    JAVA与.NET是现今世界竞争激烈的两大开发媒体,两者语言有很多相似的地方.而在很多大型的开发项目里面,往往需要使用两种语言进行集成开发.而很多的开发人员都会偏向于其中一种语言,在使用集成开发的时候 ...

  6. 转载 iOS js oc相互调用（JavaScriptCore） --iOS调用js

    iOS js oc相互调用(JavaScriptCore)   从iOS7开始 苹果公布了JavaScriptCore.framework 它使得JS与OC的交互更加方便了. 下面我们就简单了解一下这 ...

  7. Unity3D中C#和js方法相互调用

    通过查找资料,Unity3D中C#和js要相互调用彼此的方法,js文件必须放在"Standard Assets". "Pro Standard Assets" ...

  8. .Net 与 Java 的服务接口相互调用

    本文介绍.Net 与 Java 相互调用的例子.下面的介绍主要包括三方面:一是通过常用Web服务进行相互调用,二是使用TCP/IP套接字进行相互调用,三是使用Remote实现远程对象相互调用. 首先说 ...

  9. JAVA与.NET的相互调用——利用JNBridge桥接模式实现远程通讯

    分布式开发的历史 利用Remote方式调用远程对象实现服务器与客户端之间通讯是一种常用的网络开发方式,在.NET与JAVA开发当中,对Remote远程对象早已有着足够的支持(对Remote远程对象调用 ...

随机推荐

  1. 数据库的增、删、改、查 (CURD)

    增改查删可以用CURD来表示  增加:create  修改:update   查找:read      删除:delete 增加create :  insert +表名+values+(信息): in ...

  2. curl 异步捉取数据类

    <?php class RequestLib { /** * GET 请求 * @param string $url */ public static function http_get($ur ...

  3. flask自动代码自动补全

    编写py文件时,无法补全: 在app对象后面添加:# type:Flask app=Flask(__name__)   # type:Flask from flask import Flask, fl ...

  4. 数据库中char和varchar区别

    区别: 1)char长度是固定,而varchar长度是可变的: 比如:'abc'对于char(10)表示存储字符将占10个字节(包括7个空字符),而同样varchar(10)只占3个自己长度,10只是 ...

  5. 选择排序法、冒泡排序法、插入排序法、系统提供的底层sort方法排序之毫秒级比较

    我的代码: package PlaneGame;/** * 选择排序法.冒泡排序法.插入排序法.系统提供的底层sort方法排序之毫秒级比较 * @author Administrator */impo ...

  6. 非关系型数据库&&缓存

    面试其他篇 目录: 1.1

  7. mysql "The user specified as a definer ('root'@'%') does not exist" 问题

    在重配mysql的时候碰到, 解决办法: 重新授权 grant all privileges on *.* to root@"%" identified by ".&qu ...

  8. mysql 用存储过程插入11位 随机数

    BEGIN #Routine body goes here... ; ); ); ); ); ); ); ); ); ); ); ); ); ) DEFAULT ''; ); ); WHILE row ...

  9. CentOS7使用命令连接网络配置

    背景 在安装完CentOS7无桌面的情况下,无法使用桌面图标连接,如下图所示,这时我们需要在配置文件中配置网络连接信息. 步骤 查看ip地址:ifconfig PS:在未连接网络之前,我们是查看不到i ...

  10. 【做题】CF1045(ABH)

    原文链接https://www.cnblogs.com/cly-none/p/9697662.html 题目当然不会做完了,这里只讲有做&会做的. A. Last chance 题意:有\(n ...