在Android的开发过程中、遇到一个新需求、那就是让Java代码和Javascript代码进行交互、在IOS中实现起来很麻烦、而在Android中相对来说容易多了、Android对这种交互进行了很好的封装、我们可以很简单的用Java代码调用WebView中的js函数、也可以用WebView中的js来调用Android应用中的Java代码。
案例主要包含了:
- Html中调用Android方法
- Android调用JS方法无参数
- Android调用JS方法有参数
- Android调用JS方法有参数且有返回值处理方式1
- Android调用JS方法有参数且有返回值处理方式2(Android4.4以上)
1:创建JS对象
webView.addJavascriptInterface(new JsInterface(), "obj"); public class JsInterface { //JS中调用Android中的方法 和返回值处理的一种方法 /**** * Html中的点击事件 onclick * <input type="button" value="结算" onclick="showToast('12')"> * @param toast */ @JavascriptInterface public void showToast(String toast) { Toast.makeText(MainActivity.this, "你的商品价格是:¥"+toast, Toast.LENGTH_SHORT).show(); } } function showToast(toast) { var money=toast*3; javascript:obj.showToast(money); }
2:
webView.loadUrl("javascript:funFromjs()"); function funFromjs(){ document.getElementById("helloweb").innerHTML="div显示数据,无参数"; }
3:
webView.loadUrl("javascript:funJs('Android端传入的信息,div标签中显示,含参数')"); function funJs(msg){ document.getElementById("hello2").innerHTML=msg; }
4:
webView.loadUrl("javascript:sum(6,6)"); /*** * Android代码调用获取J是中的返回值 * * @param result */ @JavascriptInterface public void onSum(int result) { Toast.makeText(MainActivity.this, "Android调用JS方法且有返回值+计算结果=="+result, Toast.LENGTH_SHORT).show(); } function sum(i,m){ var result = i*m; document.getElementById("h").innerHTML= "Android调用JS方法且有返回值--计算结果="+result; javascript:obj.onSum(result) }
5:
webView.evaluateJavascript("sumn(6,11)", new ValueCallback<String>() { @Override public void onReceiveValue(String value) { Toast.makeText(MainActivity.this, "返回值"+value, Toast.LENGTH_SHORT).show(); } }); function sumn(i,m){ var result = i*m; document.getElementById("hh").innerHTML= "Android调用JS方法且有返回值--计算结果="+result; return result; }
注意:
1、Java 调用 js 里面的函数、效率并不是很高、估计要200ms左右吧、做交互性很强的事情、这种速度很难让人接受、而js去调Java的方法、速度很快、50ms左右、所以尽量用js调用Java方法
2、Java 调用 js 的函数、没有返回值、调用了就控制不到了
3、Js 调用 Java 的方法、返回值如果是字符串、你会发现这个字符串是 native 的、转成 locale 的才能正常使用、使用 toLocaleString() 函数就可以了、不过这个函数的速度并不快、转化的字符串如果很多、将会很耗费时间
4、网页中尽量不要使用jQuery、执行起来需要5-6秒、最好使用原生的js写业务脚本、以提升加载速度、改善用户体验。
注:使用的是本地的Html文件,不过在网络链接的Html文件也是可以实现的。
源码点击下载
相关推荐
接下来,我们讨论如何实现WebView与JavaScript的交互。Android提供了两种主要的方法:`addJavascriptInterface()`和`evaluateJavascript()`。 1. **addJavascriptInterface()**: 这个方法可以将Android对象暴露给...
接下来,我们要讨论的是如何实现WebView与JavaScript的交互。在iOS中,`UIWebView`提供了两个主要的方法来实现这一功能:`stringByEvaluatingJavaScriptFromString:`和`addScriptMessageHandler:name:`。 1. `...
3. **异步调用**:如果JavaScript调用Android方法需要较长的时间,可以考虑使用异步处理,以免阻塞UI线程。 总之,Android中的WebView与JavaScript的交互是通过暴露Java对象和调用JavaScript函数实现的,这种方式极...
总之,Android WebView与JavaScript的交互为开发者提供了丰富的可能性,既可利用Web技术快速构建界面,又能通过Java接口实现原生功能,提高应用的可扩展性和灵活性。正确理解和运用这一特性,可以使我们的Android...
- JavaScript调用Android:在JavaScript中调用注册接口的方法,例如`window.androidFunction()`,这将在Android端执行对应的javaFunction()方法。 4. 安全性考虑: - @JavascriptInterface注解:自API 17起,为...
三、JavaScript调用Android方法 在JavaScript中,可以通过window对象访问到Android提供的接口。比如上面的例子,我们可以在JavaScript中这样调用: ```javascript window.android.showToast('Hello from JavaScript...
这份"Android高级应用源码-Android webView和js交互的Demo"就为我们展示了如何实现这种交互。 首先,我们需要了解`WebView`的基本用法。在Android中,我们通过`WebView`类来创建一个可以浏览网页的视图。例如,我们...
这里需要用到WebView的`addJavascriptInterface`方法,创建一个Java对象并暴露给JavaScript调用。例如,我们可以创建一个名为`WebAppInterface`的类: ```java public class WebAppInterface { private Context ...
接下来,我们将讨论如何从JavaScript调用Android Java代码。这通常通过`addJavascriptInterface()`方法实现,该方法接受一个Java对象和一个字符串参数,这个字符串将在JavaScript中作为接口名使用: ```java ...
若想从JavaScript调用Android方法,我们可以使用`addJavascriptInterface()`方法,将Java对象暴露给JavaScript环境: ```java webView.addJavascriptInterface(new Object() { @JavascriptInterface @Override ...
为了使Android移动项目能够在较短的时间内完成开发,同时降低技术人员开发的成本投入,往往会采用Hybrid APP的开发模式。...势必需要了解与掌握Android[java]与JavaScript之间的交互、相互调用操作的方法与技术。
Android和javascript的交互是混合开发的核心,通过WebView和JavaScriptInterface,我们可以轻松地在两者之间传递数据和执行复杂操作。理解并熟练掌握这些技术,能够帮助我们构建更加健壮、功能丰富的Android混合应用...
本示例项目"Webview与Javascript相互调用 (Android Studio)"就是专门针对这一功能的演示,它提供了直接在Android Studio中运行的代码,帮助开发者理解和实践WebView与JavaScript之间的通信。 首先,我们来深入理解...
为了使H5页面能够调用Android原生的拍照功能,我们需要在Java代码中实现一个JavaScript接口。这可以通过WebView的addJavascriptInterface方法实现。下面是一个简单的示例: ```java private class ...
JavaScript交互是通过`WebView`的`addJavascriptInterface()`方法实现的。此方法允许我们将Java对象暴露给网页中的JavaScript代码,以便它们可以调用Java方法。例如,我们可能创建一个名为`Bridge`的Java对象,并...
同时,WebView还提供了Java代码与JavaScript交互的能力,使得我们可以利用JavaScript的灵活性和Android原生功能的强大结合,创建出丰富的混合应用。本文将详细介绍如何在Android中使用WebView实现Java程序与JS脚本的...
三、JavaScript调用Android方法:WebViewClient和WebChromeClient 1. 使用`WebViewClient`: 我们可以通过重写`shouldOverrideUrlLoading`方法,使得JavaScript的URL请求被Java代码捕获并处理。 ```java webView....
这个Demo项目是学习和实践Android WebView与JavaScript交互的一个好资源,可以帮助开发者掌握如何在Android应用中嵌入网页并实现双向通信,提升用户体验。通过分析和运行此源码,开发者可以深入理解Android WebView...