Android webview 注入JS

群友提出一个问题,webview load 一个页面,页面如图所示
这里写图片描述
要求是点击“高速下载”后,回调android的方法(我才可能要传参数给android)

package com.example.bxh.sayhello;

import android.annotation.SuppressLint;
import android.graphics.Bitmap;
import android.util.Log;
import android.webkit.ConsoleMessage;
import android.webkit.JavascriptInterface;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

/**
 * Created by bxh on 6/6/17.
 */
@SuppressLint("SetJavaScriptEnabled")
public class WebViewTest {
    final static String TAG = "WebViewTest";
    WebView webView;

    public WebViewTest(WebView webview) {
        this.webView = webview;
    }

    void testWebView() {
        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setDomStorageEnabled(true);
        settings.setAllowFileAccess(true);
        settings.setLoadWithOverviewMode(true);
        settings.setDomStorageEnabled(true);
        // 添加js交互接口类,并起别名 injectedObject
        webView.addJavascriptInterface(new JsObject(), "injectedObject");

        //webView.loadUrl("https://www.baidu.com");
        //webView.loadUrl("http://blog.csdn.net/smile_raccoon/article/details/52786124?locationNum=5");
        webView.loadUrl("http://app.qq.com/#id=index");
        webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                return super.onJsAlert(view, url, message, result);
            }

            @Override
            public void onConsoleMessage(String message, int lineNumber, String sourceID) {
                super.onConsoleMessage(message, lineNumber, sourceID);
            }

            @Override
            public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
                Log.i(TAG,"injectedObject consoleMessage="+consoleMessage.message());
                return super.onConsoleMessage(consoleMessage);
            }
        });
        webView.setWebViewClient(new WebViewClient() {
                                     @Override
                                     public boolean shouldOverrideUrlLoading(WebView view, String url) {
//                                         if (url.startsWith("http")) {
//                                             return false;
//                                         }
                                         return super.shouldOverrideUrlLoading(view, url);
                                     }

                                     @Override
                                     public void onPageFinished(WebView view, String url) {
                                         super.onPageFinished(view, url);
                                         //view.loadUrl("javascript:alert(injectedObject.toString())");
                                         addImageClickListner();
                                     }

                                     @Override
                                     public void onPageStarted(WebView view, String url, Bitmap favicon) {
                                         super.onPageStarted(view, url, favicon);
                                     }

                                     @Override
                                     public void onLoadResource(WebView view, String url) {
                                         super.onLoadResource(view, url);
                                     }

                                     @Override
                                     public void onPageCommitVisible(WebView view, String url) {
                                         super.onPageCommitVisible(view, url);

                                     }
                                 }


        );

    }

    /**
     * 这段js函数的功能就是,遍历所有的button,并添加onclick函数,
     * 函数的功能是在button点击的时候调用本地java接口并传递参数过去
     */
    private void addImageClickListner() {

        this.webView.loadUrl("javascript:(function(){" +
                "var objs = document.getElementsByClassName(\"xz\");" +
                "console.info('objs is '+objs+'--objs.length is '+objs.length);"+
                "for(var i=0;i<objs.length;i++)" +
                "{"+
                     "console.info('objs[i]'+objs[i]);"+
                     "objs[i].onclick=function()" +
                    "{" +
                        "window.injectedObject.toString();" +
                    "}" +
                "}"+
                "}())");
    }

    class JsObject {
        @JavascriptInterface
        public String toString() {
            Toast.makeText(MyApp.context, "ahhahah", Toast.LENGTH_SHORT).show();
            Log.i(TAG,"injectedObject toString()");
            return "injectedObject";
        }
    }
}
<div class="appList">
            <ul>
              <li data-url="http://qqwx.qq.com/s?aid=index&g_f=388">
                <div class="img"><img src="http://img1.gtimg.com/ent/pics/hv1/144/163/1604/104341809.png" /></div>
                <div class="txt">
                  <h3><span>腾讯手机管家</span></h3>
                  <p>7.2M</p>
                </div>
                <div class="xz"></div>
              </li>
              <li data-url="http://sfile.3g.qq.com/msoft/sec/secure/channel/14/2/KingRoot_Android_3.4.1.157-General_105141.apk">
                <div class="img"><img src="http://img1.gtimg.com/www/pics/hv1/2/231/1712/111381707.png" /></div>
                <div class="txt">
                  <h3><span>Kingroot</span></h3>
                  <p>1.41M</p>
                </div>
                <div class="xz"></div>
              </li>
              <li data-url="http://softfile.3g.qq.com/msoft/apk/qq2013/qq2013_4.2.0.1570_android.apk">
                <div class="img"><img src="http://mat1.gtimg.com/joke/webapp/img/kanbisai.png" /></div>
                <div class="txt">
                  <h3><span>看比赛</span></h3>
                  <p>4.8M</p>
                </div>
                <div class="xz"></div>
              </li>
              <li data-url="http://im.qq.com/mobileqq/">
                <div class="img"><img src="http://img1.gtimg.com/www/pics/hv1/142/227/1857/120809452.png" /></div>
                <div class="txt">
                  <h3><span>QQ手机版</span><span class="hot"></span></h3>
                  <p>22.8M</p>
                </div>
                <div class="xz"></div>
                …………………………省略后面………………

目前问题没有解决,虽然可以回调android的方法,但是js方法那里我不懂,不知道怎么获取对应的参数……没学过js,择日再弄……

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值