Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true
Android(Java)与JavaScript(HTML)交互有四种情况:
1) Android(Java)调用HTML中js代码
2) Android(Java)调用HTML中js代码(带参数)
3) HTML中js调用Android(Java)代码
4) HTML中js调用Android(Java)代码(带参数)
下面示例总结这四种情况,直接上干货:
1) Android(Java)
- private void showWebView(){ // webView与js交互代码
- try {
- mWebView = new WebView(this);
- setContentView(mWebView);
- mWebView.requestFocus();
- mWebView.setWebChromeClient(new WebChromeClient(){
- @Override
- public void onProgressChanged(WebView view, int progress){
- JSAndroidActivity.this.setTitle("Loading...");
- JSAndroidActivity.this.setProgress(progress);
- if(progress >= 80) {
- JSAndroidActivity.this.setTitle("JsAndroid Test");
- }
- }
- });
- mWebView.setOnKeyListener(new View.OnKeyListener() { // webview can go back
- @Override
- public boolean onKey(View v, int keyCode, KeyEvent event) {
- if(keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) {
- mWebView.goBack();
- return true;
- }
- return false;
- }
- });
- WebSettings webSettings = mWebView.getSettings();
- webSettings.setJavaScriptEnabled(true);
- webSettings.setDefaultTextEncodingName("utf-8");
- mWebView.addJavascriptInterface(getHtmlObject(), "jsObj");
- mWebView.loadUrl("http://192.168.1.121:8080/jsandroid/index.html");
- } catch (Exception e) {
- e.printStackTrace();
- }
- }
- private Object getHtmlObject(){
- Object insertObj = new Object(){
- public String HtmlcallJava(){
- return "Html call Java";
- }
- public String HtmlcallJava2(final String param){
- return "Html call Java : " + param;
- }
- public void JavacallHtml(){
- runOnUiThread(new Runnable() {
- @Override
- public void run() {
- mWebView.loadUrl("javascript: showFromHtml()");
- Toast.makeText(JSAndroidActivity.this, "clickBtn", Toast.LENGTH_SHORT).show();
- }
- });
- }
- public void JavacallHtml2(){
- runOnUiThread(new Runnable() {
- @Override
- public void run() {
- mWebView.loadUrl("javascript: showFromHtml2('IT-homer blog')");
- Toast.makeText(JSAndroidActivity.this, "clickBtn2", Toast.LENGTH_SHORT).show();
- }
- });
- }
- };
- return insertObj;
- }
2) js(HTML)
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!-- saved from url=(0032)http://localhost:8080/jsandroid/ -->
- <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta http-equiv="Expires" content="0">
- <meta http-equiv="Pragma" content="no-cache">
- <meta http-equiv="Cache-Control" content="no-store,no-cache">
- <meta name="Handheldfriendly" content="true">
- <meta name="viewport" content="width=100%; initial-scale=1.0; user-scalable=yes">
- <meta name="robots" content="all">
- <meta name="keywords" contect="doodle, mobile, doodlemobile, game, games">
- <meta name="description" content="Make People's Mobile Life More Connected Through Games.">
- <title>jsandroid_test</title>
- <script type="text/javascript" language="javascript">
- function showHtmlcallJava(){
- var str = window.jsObj.HtmlcallJava();
- alert(str);
- }
- function showHtmlcallJava2(){
- var str = window.jsObj.HtmlcallJava2("IT-homer blog");
- alert(str);
- }
- function showFromHtml(){
- document.getElementById("id_input").value = "Java call Html";
- }
- function showFromHtml2( param ){
- document.getElementById("id_input2").value = "Java call Html : " + param;
- }
- </script>
- </head>
- <body>
- hello IT-homer
- <br>
- <br>
- <br>
- <input type="button" value="HtmlcallJava" onclick="showHtmlcallJava()" />
- <br>
- <input type="button" value="HtmlcallJava2" onclick="showHtmlcallJava2()" />
- <br>
- <br>
- <br>
- <br>
- <input id="id_input" style="width: 90%" type="text" value="null" />
- <br>
- <input type="button" value="JavacallHtml" onclick="window.jsObj.JavacallHtml()" />
- <br>
- <br>
- <br>
- <input id="id_input2" style="width: 90%" type="text" value="null" />
- <br>
- <input type="button" value="JavacallHtml2" onclick="window.jsObj.JavacallHtml2()" />
- </body>
- </html>
-
3) 运行结果:
4) 代码解析:
(1) 允许Android执行js脚本设置
Android(Java)与js(HTML)交互的接口函数是: mWebView.addJavascriptInterface(getHtmlObject(), "jsObj"); // jsObj 为桥连对象
Android容许执行js脚本需要设置: webSettings.setJavaScriptEnabled(true);
(2) js(HTML)访问Android(Java)代码
js(HTML)访问Android(Java)端代码是通过jsObj对象实现的,调用jsObj对象中的函数,如: window.jsObj.HtmlcallJava()
(3) Android(Java)访问js(HTML)代码
Android(Java)访问js(HTML)端代码是通过loadUrl函数实现的,访问格式如:mWebView.loadUrl("javascript: showFromHtml()");
说明:
1) Android访问url网址,需在AndroidManifest.xml文件,配置容许访问网络的权限:
<uses-permission android:name="android.permission.INTERNET" />2) Android(Java)调用js(HTML)时,使用的mWebView.loadUrl("javascript: showFromHtml()");函数需在UI线程运行,因为mWebView为UI控件
- public void JavacallHtml(){
- runOnUiThread(new Runnable() {
- @Override
- public void run() {
- mWebView.loadUrl("javascript: showFromHtml()");
- Toast.makeText(JSAndroidActivity.this, "clickBtn", Toast.LENGTH_SHORT).show();
- }
- });
- }
相关推荐
android与js交互实例,分为android调用js页面,js页面调用android这两种情况,做了详细的介绍
JS与Android互相调用实例
本例子实现android调用JS有参和无参方法,以及JS调用android方法
这是一个演示Android与JavaScript交互的例子 附源代码,演示Android如何支持Js,添加接口对象 invokeTa 可以随便定义,Android与Js交互的类似标识Id的东西,加载Js。演示了Android调用Js 无参数和Android调用Js 传入...
android与js交互调用svg标签的代码实例。代码通俗易懂,方便初学者学习。
WebView使用之Js交互,点击webview中的图片,调用java代码,放大展示图片,并提供缩放功能!参考博客地址:http://blog.csdn.net/growing_tree/article/details/44652005
android和js进行交互,相互调用。
Android笔记webview与js交互实例,详细介绍使用loadUrl(),evaluateJavascript(),addJavascriptInterface(),等方式实现交互。
摘要:Java源码,Android源码,Android Js与Android相结合,产生更多交互的效果,运行时请确保本机的Android运行环境无误,否则JS提示错误。本例子较基础的交互,容易理解。HTML文件是与Android交互的入口,双击这个...
主要介绍了Android中Java和JavaScript交互实例,本文给出了实现方法、实现代码、js调用Java、java调用js等内容,需要的朋友可以参考下
摘要:Java源码,Android源码,Android交互例子 Android与Js交互的演示实例,与JavaScript交互的例子,获得浏览器组件。 //WebView就是一个简单的浏览器 //android浏览器源码存在于LINUX/android/package/apps/...
android + h5 混合开发 webview 版 小实例 + 数据交互 + 界面交互+ js调用java +java 调用js
主要介绍了android中WebView和javascript实现数据交互实例,需要的朋友可以参考下
主要介绍了android中webview控件和javascript交互实例,例子中包括javascript调用java的方法,java代码中调用javascript的方法,需要的朋友可以参考下
Android中webview与JS交互、互调方法实例详解 前言: 对于试水的功能,一般公司都会采用H5的方式来开发,可以用很少的资源与很短的项目工期来完成。 但许多情况下,H5页面会需要一些原生持有的一些如用户信息之类的...
android上百实例源码及分析 360新版特性界面源代码.rar 888个经典 Logo.rar aidl跨进程调用.rar Android模仿乐淘的应用程序分析源码.zip ...Android与js交互.rar Android远程登录含有loading登录效.zip 。。。。
主要介绍了Android与JS之间跨平台异步调用实例详解的相关资料,需要的朋友可以参考下
Android WebView与JS交互实例 下载 https://fir.im/webviewstudy 修复 修复显示多个进度条问题 修复net::ERR_UNKNOWN URL SCHEME的问题 可根据SCHEME跳京东,支付宝,微信原生App,用户可根据包名自行添加 ...