解析Android中webview和js之间的交互

2016-02-19 08:56 2 1 收藏

下面图老师小编跟大家分享一个简单易学的解析Android中webview和js之间的交互教程,get新技能是需要行动的,喜欢的朋友赶紧收藏起来学习下吧!

【 tulaoshi.com - 编程语言 】

1.android中利用webview调用网页上的js代码。
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true,,然后通过loadUrl就可以直接进行调用,如下所示:
mWebView.getSettings().setJavaScriptEnabled(true);
mWebView.loadUrl("javascript:test()");

2. 网页上调用android中java代码的方法
在网页中调用java代码,需要在webview控件中添加javascriptInterface。如下所示:
代码如下:

mWebView.addJavascriptInterface(new Object() {
            public void clickOnAndroid() {
                mHandler.post(new Runnable() {
                    public void run() {
                        Toast.makeText(Test.this, "测试调用java", Toast.LENGTH_LONG).show();
                    }
                });
            }
        }, "demo");

在网页中,只需要像调用js方法一样,进行调用就可以
div id='b'a onclick="window.demo.clickOnAndroid()"b.c/a/div

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/bianchengyuyan/)

3. Java代码调用js并传参
首先需要带参数的js函数,如function test(str),然后只需在调用js时传入参数即可,如下所示:
mWebView.loadUrl("javascript:test('aa')");

4.Js中调用java函数并传参
首先一样需要带参数的函数形式,但需注意此处的参数需要final类型,即得到以后不可修改,如果需要修改其中的值,可以先设置中间变量,然后进行修改。如下所示:
代码如下:

mWebView.addJavascriptInterface(new Object() {
            public void clickOnAndroid(final int i) {
                mHandler.post(new Runnable() {
                    public void run() {
                                int j = i;
                                j++;
Toast.makeText(Test.this, "测试调用java" + String.valueOf(j), Toast.LENGTH_LONG).show();
                    }
                });
            }
        }, "demo");

然后在html页面中,利用如下代码div id='b'a onclick="window.demo.clickOnAndroid(2)"b.c/a/div,
即可实现调用

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/bianchengyuyan/)

来源:http://www.tulaoshi.com/n/20160219/1588903.html

延伸阅读
今天这篇文章是华为总监EDC尤原庆读完《设计师要懂心理学》后写的读书笔记,总18条,每一条都有读者注解,不管之前是否读过。都建议来看看总监的读书视角。 今天写了一篇读书笔记,希望有帮助。 设计师要懂心理学读书笔记 设计师要懂心理学这本书很有趣,首先它很简单,任何对设计感兴趣的读者都可以轻松阅读并理解,其次它很真实,能给设...
网页中常见一些页面其复杂程度是递进的,类似变形金刚日常保持汽车人形态,遇到战斗场面他们会伸展出四肢抡起武器为自由而战! 在交互设计中我们称这种类似变形的情形为渐进展开。该策略用来应对展现复杂的信息,即只有在用户需要的情况下,才显示信息。适当地使用此设计原则,可使产品简约,操作逻辑清晰。以下举几枚栗子,请大家品尝。 实现...
线框图并非是原型,但即使是经验丰富的设计师也可能会将两者混为一谈。实际上,两者的差别还是非常多且明显的,那么就让我们通过这篇文章分辨清楚这俩概念,一劳永逸。 线框图 线框图是产品设计的低保真呈现方式。它有三个简单直接而明确的目标: 1、呈现主体信息群 2、勾勒出结构和布局 3、用户交互界面的主视觉和描述 正确地创建了线框...
Android设备多分辨率的问题 Android浏览器默认预览模式浏览 会缩小页面 WebView中则会以原始大小显示 Android浏览器和WebView默认为mdpi。hdpi相当于mdpi的1.5倍 ldpi相当于0.75倍 三种解决方式:1 viewport属性 2 CSS控制 3 JS控制 1 viewport属性放在HTML的meta中 Html代码 代码如下: SPANstyle="FONT-SIZE: x-small" head titleE...
1.怎样操作剪贴板,从而实现复制、剪切与粘贴?同时判断剪贴板里边的数据是否是文本? if (!IsClipboardFormatAvailable(CF_TEXT))  return;  if (!OpenClipboard(hwndMain))  return;  hglb = GetClipboardData(CF_TEXT);  if (hglb != NULL)  {  lptstr ...

经验教程

364

收藏

43
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部