HTML---Android与js交互实例
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();
- }
- });
- }
HTML---Android与js交互实例的更多相关文章
- Android与js交互实例
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true Android(Java)与JavaScript(HTML) ...
- WebView---Android与js交互实例
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true 原文地址:http://blog.csdn.net/it10 ...
- Webview Android与js交互
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true Android(Java)与JavaScript(HTML) ...
- Android与js交互拍照上传资料
应用场景:h5通知android端拍照,选相册,然后将图片路径上传成功之后,获取到网络路径,将此路径返还给h5界面,并展示出来. android与js快速交互 效果图如下: 1.在Activity ...
- Android与js交互
本文转载自:http://blog.csdn.net/it1039871366/article/details/46372207 一文. Android 中可以通过webview来实现和js的交互,在 ...
- android 和 js 交互
1.html代码 <script type="text/javascript"> function javacalljs(){ document.getElementB ...
- Android与JS交互,json传参问题
一.JS调用Android的方法 JS调用安卓的方法,并且传递的参数为json格式的字符串(JSONObject.toString()), 例如: var json = {"name&quo ...
- Android 和 JS交互方法初探
起初有个需求,就是需要监听网页的图片点击,然后图片单独跳转到另一个页面单独显示 这里就需要用JS和Android Native方法之间的通信 先说上面的解决办法之前先引出两个Android的方法 1: ...
- Android—android与js交互以及相互传参
Android中可以通过WebView来实现与js的交互,让用户可以在android客户端看到js写的页面,接下来为大家介绍的就是怎样实现此功能: 首先android项目目录下有“assets”文件夹 ...
随机推荐
- C#正则表达式之字符替换
string strTest= "www.BaiDu.com",strRst=""; //忽略大小写,将strTest中的BaiDu替换为baidu Regex ...
- 不改变中间层,如何玩转 .NET 的远程处理功能?
原文链接: https://msdn.microsoft.com/enus/library/aa289846(v=vs.71).aspx Visual Studio .NET 2003 该方案展示了传 ...
- What's this?(js)
What's this? 由于运行期绑定的特性,JavaScript 中的 this 含义非常多,它可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式 随着函数使用场合的不同,this的 ...
- GridView使用CommandField删除列实现删除时提示确认框
在.net2005提供的GridView中我们可以直接添加一个CommandField删除列完后在它的RowDeleting事件中完成删除 GridView在使用CommandField删除时弹出提示 ...
- Delphi GDI+ Library
GDI+ LibraryThis library enables GDI+ functionality for Delphi 2009 and later. It differs from other ...
- iOS上获得MAC地址
很多时候我们都需要唯一来确定一台设备,苹果设备本来有个UDID号,可以实现这个目的.在iOS5.0以前,还有一个uniqueIdentifier的API用来获得这个number.不过iOS5之后,这个 ...
- HDU 2493 Timer 数学(二分+积分)
传送门:http://acm.hdu.edu.cn/showproblem.php?pid=2493 题意:给你一个圆锥,水平放置,圆锥中心轴与地面平行,将圆锥装满水,在圆锥某一表面开一个小洞,流出来 ...
- linux PCI设备初始化过程
linux PCI设备初始化过程 start_kernel->rest_init 这个函数会启动一个核心线程0, 核心线程然后调用init -> do_basic_setup. 然后我们开 ...
- (Deep) Neural Networks (Deep Learning) , NLP and Text Mining
(Deep) Neural Networks (Deep Learning) , NLP and Text Mining 最近翻了一下关于Deep Learning 或者 普通的Neural Netw ...
- Webform——购物车
购物车主要实现的功能: ①在主页面可以将所有商品显示出来,包括价格,库存. ②点击购买可以累加产品,如果是同一种产品,只会累加每种产品的数量. ③查看购物车,可以查看明细,包括所购物品的名称,价格,数 ...