Android端使用WebView注入一段js代码实现js调用android

简介: Android端使用WebView注入一段js代码实现js调用android

需求:为网页上个链接增加点击事件,但是这个链接无法增加js代码

url:http://public.rongcloud.cn/view/D4F444BE2D94D760329F3CF38B4AE35C

网页截图:


需要给“投融资讯“四个字设置点击事件

但是观察源码

<body>
  <div class="wrap content">
  <div class="content-inner">
  <div class="content-header">
  <h2 class="content-header-title">发货房间很干净或</h2>
  <div class="content-header-info">
  <span>2017-01-08</span>
  <span class="userId"><ahref="javascript:;">投融资讯</a></span>
  </div>
  </div>
  <div class="content-body" >
  <p style="text-align: center;margin:10px 0;">
  <img style="" src="http://7xi6ox.com1.z0.glb.clouddn.com/6ccb1a46485ecbe01324e130564a0fd9?imageView/0/w/200/h/170" />
  </p>
  <p style="margin-top:20px;" >
  <a onclick="count('http://public.rongcloud.cn/view/11C329D37EFD51832EF7E3CF2A0CE2D4', 'D4F444BE2D94D760329F3CF38B4AE35C')"style="color:#607fa6;text-decoration:none;"href="javascript:void(0)" >阅读原文</a>
  </p>
  </div>
  <div class="divider" style="height: 1px;margin: 9px 0;overflow: hidden;background-color: #e5e5e5;margin-top: 18px;"></div>
  </div>



并没有具体的onclick事件,怎么办呢?

1、首先在Chrome上写了端测试代码,测试没问题

</div><div>     var child=document.getElementsByTagName('a')[0];</div><div>     child.οnclick=function(){</div><div>         userIdClick();</div><div>     };</div><div>     function userIdClick(){ </div><div>        myObj.getClose();</div><div><br /></div><div><br /></div><div>     };</div><div>


2、然后使用安卓端注入进来

webview.getSettings().setJavaScriptEnabled(true);  
webview.addJavascriptInterface(new JSObject(), "myObj");
webview.setWebViewClient(new WebViewClient() {
public boolean shouldOverrideUrlLoading(WebView view, String url) {
Toast.makeText(MainActivity.this, "wodo-7-", Toast.LENGTH_SHORT).show();
view.loadUrl(url);
return true;
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
String  js = "var script = document.createElement('script');";
js+= "script.type = 'text/javascript';";
   js+="var child=document.getElementsByTagName('a')[0];";
   js+="child.οnclick=function(){userIdClick();};";
   js+= "function userIdClick(){myObj.getClose();};";
webview.loadUrl("javascript:" + js);
}
});
class JSObject {
@JavascriptInterface
// sdk17版本以上加上注解
public String getData(String txt) {
return "12345678";
}
@JavascriptInterface
// sdk17版本以上加上注解
public void getClose() {
Toast.makeText(MainActivity.this, "dododo", Toast.LENGTH_SHORT)
.show();
// finish();
}
}

这样就可以实现点击调用本地方法了。


二、如果想获取html中某个内容


@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
String  js = "var script = document.createElement('script');";
js+= "script.type = 'text/javascript';";
   js+="var child=document.getElementsByTagName('a')[0];";
   js+="child.οnclick=function(){userIdClick();};";
   js+= "function userIdClick(){myObj.getClose();};";
webview.loadUrl("javascript:" + js);
// view.loadUrl("javascript:window.myObj.showSource(document.getElementsByTagName('p')[1].innerHTML);"); 
view.loadUrl("javascript:myObj.showSource(document.getElementsByTagName('p')[0].innerHTML);");   //关键代码
}
});
/**
* 本地化JS对象(第一种方法)
* 
* @author jiangwei1-g
*/
class JSObject {
@JavascriptInterface
// sdk17版本以上加上注解
public String getData(String txt) {
return "12345678";
}
@JavascriptInterface
// sdk17版本以上加上注解
public void getClose() {
Toast.makeText(MainActivity.this, "dododo", Toast.LENGTH_SHORT).show();
}
@JavascriptInterface
// sdk17版本以上加上注解
public void showSource(String html) { //关键代码
Toast.makeText(MainActivity.this, html, Toast.LENGTH_SHORT).show();
            System.out.println("====>html="+html); 
        } 
}
目录
相关文章
|
2月前
|
移动开发 JavaScript Java
Android与JS互相调
Android与JS互相调
|
3月前
|
安全 JavaScript 前端开发
kotlin开发安卓app,JetPack Compose框架,给webview新增一个按钮,点击刷新网页
在Kotlin中开发Android应用,使用Jetpack Compose框架时,可以通过添加一个按钮到TopAppBar来实现WebView页面的刷新功能。按钮位于右上角,点击后调用`webViewState?.reload()`来刷新网页内容。以下是代码摘要:
|
3月前
|
JavaScript 前端开发 Android开发
kotlin开发 webview如何在收到JS调用后,native返回数据给到JS
这段内容描述了在Hybrid App开发中,使用Kotlin的Compose构建的Web视图(WebView)如何通过JsBridge实现JavaScript与原生代码的交互
|
3月前
|
JavaScript 前端开发 Android开发
kotlin安卓在Jetpack Compose 框架下使用webview , 网页中的JavaScript代码如何与native交互
在Jetpack Compose中使用Kotlin创建Webview组件,设置JavaScript交互:`@Composable`函数`ComposableWebView`加载网页并启用JavaScript。通过`addJavascriptInterface`添加`WebAppInterface`类,允许JavaScript调用Android方法如播放音频。当页面加载完成时,执行`onWebViewReady`回调。
|
2月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的高校后勤网上报修系统安卓app附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的高校后勤网上报修系统安卓app附带文章源码部署视频讲解等
36 0
|
前端开发 JavaScript
8 种技巧让你编写更简洁的 JavaScript 代码
8 种技巧让你编写更简洁的 JavaScript 代码
242 0
8 种技巧让你编写更简洁的 JavaScript 代码
|
Web App开发 JavaScript 前端开发
|
Web App开发 JavaScript 前端开发
【译】如何编写避免垃圾开销的实时 JavaScript 代码
本文讲的是【译】如何编写避免垃圾开销的实时 JavaScript 代码,哇,这篇文章已经写了有很长一段时间了,十分感谢那些精彩的回复!其中有一些对于一些技术的指正,如使用 'delete' 。我知道了使用它可能会导致其他的降速问题,因此,我们在引擎中极少使用它。
1145 0