Android与JavaScrip进行交互（二）
一、思路分析
经过測试发现，JS中的点击事件仅仅能写一个，假设写了多个，也仅仅会响应第一个，假设写的方法是android端的方法，在web端执行时，后台会报没有定义这种方法的错误。前台点击无响应。
所以，假设想要web中某个button在web端响应的是JS中的方法，而在android端响应的是android端的方法。就须要自己在页面载入完成时。手动注入JS函数监听。
二、代码
demo3.html
该段代码是放在assets目录下的
<? xml version="1.0" encoding="UTF-8"? ><!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>veikr的博客 </title>
<meta name="generator" content="WordPress 3.5.1" />
<meta name="wap-version" content="1.10 (2008.8.3)" />
<link rel="alternate" type="application/rss+xml" title="veikr的博客 RSS Feed" href="http://veikr.com/feed" />
<link rel="pingback" href="http://veikr.com/xmlrpc.php" />
<link rel="shortcut icon" href="http://veikr.com/wp-content/themes/twentyten/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="wap.css" type="text/css" media="all" />
</head>
<body> <input type="button" id="testbtn" value="我是button1"
onClick="window.imagelistner.openImage()"
onClick="test2()"
/> <input onClick="test()" type="button" id="testbtn2" value="我是button2"/>
<a onClick="test3()">
<div style="width:80px;
margin:0px auto;
padding:10px;
text-align:center;
border:2px solid #202020;" >
<img id="droid" src="http://www.baidu.com/img/bd_logo1.png" /><br>
Click me!
</div>
</a>
</body>
<script language="javascript">
function test(){
alert("点击了button2");
}
function test2(){
alert("点击了button1");
}
function test3(){
alert("点击了图片");
} function wave() {
alert("点击了andorid中的button");
}
</script>
</html>
界面显演示样例如以下
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvWjE4Nzg5MjMxODc2/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" > <WebView
android:id="@+id/webview"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="9" /> </LinearLayout>
MainActivity.java
package wst.webview; import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.webkit.WebView;
import android.webkit.WebViewClient; @SuppressLint("SetJavaScriptEnabled")
public class MainActivity extends Activity { private WebView contentWebView = null; @SuppressLint("SetJavaScriptEnabled")
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
contentWebView = (WebView) findViewById(R.id.webview);
// 启用javascript
contentWebView.getSettings().setJavaScriptEnabled(true);
// 载入本地html文件，内容如上
contentWebView.loadUrl("file:///android_asset/demo3.html");
// 加入js交互接口类。并起别名 imagelistner
contentWebView.addJavascriptInterface(new JavascriptInterface(this), "imagelistner");
contentWebView.setWebViewClient(new MyWebViewClient()); } // 注入js函数监听
<span style="white-space:pre"> </span>//以下提供了三种js注入函数，能够依据需求选择对应的JS函数
private void addImageClickListner() {
// 这段js函数的功能就是。遍历全部的img几点，并加入onclick函数，在还是运行的时候调用本地接口传递url过去
contentWebView.loadUrl("javascript:(function(){" +
"var objs = document.getElementsByTagName(\"img\"); " +
"for(var i=0;i<objs.length;i++) " +
"{"
+ " objs[i].onclick=function() " +
" { "
+ " window.imagelistner.openImage(this.src); " +
" } " +
"}" +
"})()");
//这段Js函数的功能是捕捉JS中的代码。对当中的id为testbtn的button。又一次加入点击事件
contentWebView.loadUrl("javascript:(function(){" +
"var obj = document.getElementById(\"testbtn\");" +
" obj.onclick=function() " +
" { "
+ " window.imagelistner.clickButton(); " +
" } " + "})()");
//这段js函数的功能是遍历全部的input几点，加入点击事件
contentWebView.loadUrl("javascript:(function(){" +
"var objs = document.getElementsByTagName(\"input\"); " +
"for(var i=0;i<objs.length;i++) " +
"{"
+ " objs[i].onclick=function() " +
" { "
+ " window.imagelistner.clickButton(); " +
" } " +
"}" +
"})()"); } // js通信接口
public class JavascriptInterface { private Context context; public JavascriptInterface(Context context) {
this.context = context;
} public void openImage(String img) {
System.out.println(img);
//
Intent intent = new Intent();
intent.putExtra("image", img);
intent.setClass(context, ShowWebImageActivity.class);
context.startActivity(intent);
System.out.println(img);
}
public void clickButton(){
Intent intent = new Intent(context,SecondActivity.class);
startActivity(intent);
}
} // 监听
private class MyWebViewClient extends WebViewClient {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) { return super.shouldOverrideUrlLoading(view, url);
} @Override
public void onPageFinished(WebView view, String url) { view.getSettings().setJavaScriptEnabled(true); super.onPageFinished(view, url);
// html载入完毕之后，加入监听图片的点击js函数
addImageClickListner(); } @Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
view.getSettings().setJavaScriptEnabled(true); super.onPageStarted(view, url, favicon);
} @Override
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) { super.onReceivedError(view, errorCode, description, failingUrl); }
} }
三、效果分析
点击图片，响应android端注入的JS函数监听；可是在web端响应的还是原来的监听。
button也相同如此。
Android与JavaScrip进行交互（二）的更多相关文章
- Android系列之网络（二）----HTTP请求头与响应头
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/ ...
- android json解析及简单例子+Android与服务器端数据交互+Android精彩案例【申明：来源于网络】
android json解析及简单例子+Android与服务器端数据交互+Android精彩案例[申明:来源于网络] android json解析及简单例子:http://www.open-open. ...
- 客户端相关知识学习（三）之Android原生与H5交互的实现
Android原生与H5交互的实现 H5调用原生的方式 方式可能有多种,根据开发经验,接触过两种方式. 方法一:Android向H5注入全局js对象,也就是H5调Android 1.首先对WebVie ...
- Android系列之Fragment（二）----Fragment的生命周期和返回栈
[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/ ...
- Android之自定义生成彩色二维码
先导个zxing.jar包 下面是xml布局 activity_main.xml <RelativeLayout xmlns:android="http://schemas.andro ...
- Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable
版权声明:本文为博主原创文章,未经博主允许不得转载. Android 仿PhotoShop调色板应用(二) 透明度绘制之AlphaPatternDrawable 这里讲一下如何实现PS调色板中的透明度 ...
- Android - 和其他APP交互 - 获得activity的返回值
启用另一个activity不一定是单向的.也可以启用另一个activity并且获得返回值.要获得返回值的话,调用startActivityForResult()(而不是startActivity()) ...
- Android - 和其他APP交互 - 把用户带到其他app
Android的重要功能之一就是app可以根据要执行的操作让用户启动另外一个app.例如,app有一个商业地址然后想要在地图上显示,并不需要在app中加一个显示地图的activity,可以直接用Int ...
- Android图表库MPAndroidChart(十二)——来点不一样的，正负堆叠条形图
Android图表库MPAndroidChart(十二)--来点不一样的,正负堆叠条形图 接上篇,今天要说的,和上篇的类似,只是方向是有相反的两面,我们先看下效果 实际上这样就导致了我们的代码是比较类 ...
随机推荐
- [转] C#中发送消息给指定的窗口，以及接收消息
原文C#中发送消息给指定的窗口,以及接收消息 public class Note { //声明 API 函数 [DllImport("User32.dll", EntryPoint ...
- [Everyday Mathematics]20150131
在 $\bbR^4$ 中定义如下有界区域 $\Omega$: $$\bex \Omega=\sed{(x,y,z,w)\in\bbR^4;\ |x|+|y|+\sqrt{z^2+w^2}\leq 1} ...
- Android控件之GridView
GridView是一项显示二维的viewgroup,可滚动的网格.一般用来显示多张图片. 以下模拟九宫图的实现,当鼠标点击图片时会进行相应的跳转链接. 目录结构 main.xml布局文件,存放Grid ...
- hive UDAF
java 程序 package com.ibeifeng.udaf; import org.apache.hadoop.hive.ql.exec.UDAF; import org.apache.had ...
- RTNETLINK answers: File exists错误
解决ssh连接虚拟机出错,RTNETLINK answers: File exists 解决步骤如下: 使用ssh连接虚拟机的时候,发现目标主机无法连接,登录虚拟机,查看ssh监听是否开启: 发现监听 ...
- 求职基础复习之快速排序c++版
#include<iostream> using namespace std; int partition(int a[],int p,int q){ int x = a[q]; ; fo ...
- [转]Ubuntu下GitHub的使用
转自Pythoner 本文将对Ubuntu下Git的安装,以及如何连接GitHub进行讲解. 1.环境 OS: Ubuntu13.04 64bitsGit: 1.8.1.2 2.Git安装 执行如下命 ...
- 安装 RabbitMQ C#使用-摘自网络（包括RabbitMQ的配置）
1.什么是RabbitMQ.详见 http://www.rabbitmq.com/ . 作用就是提高系统的并发性,将一些不需要及时响应客户端且占用较多资源的操作,放入队列,再由另外一个线程,去异步处理 ...
- mysql performance_schema 初探
mysql performance_schema 初探: mysql 5.5 版本 新增了一个性能优化的引擎: PERFORMANCE_SCHEMA 这个功能默认是关闭的: 需要设置参数: perf ...
- 第二百六十七天 how can I 坚持
晚上有点小郁闷,小纠结,感觉不应该买房,不知道什么吸引着我一定要买呢,曾经坚持不买房的我,为什么成了这个样子. 搞不懂啊. 元旦就要就看房了, 如果真的要买了,明年的压力就会很大了. 经济到底会成为啥 ...