andorid原生代码和js交互

最新推荐文章于 2024-07-24 11:23:56 发布

我是阿荣荣

最新推荐文章于 2024-07-24 11:23:56 发布

阅读量456

点赞数

分类专栏： Android视图文章标签： android

本文链接：https://blog.csdn.net/kanghaorong/article/details/53143116

版权

Android视图专栏收录该内容

5 篇文章 0 订阅

订阅专栏

Android原生代码是可以和js进行交互的，本人理解，js语言和java类似，原生代码和js一定程度上能够共享对象，通过webview控件作为二者的桥梁，可以实现方法的互相调用。

下面是代码，请注意看代码注释

activity代码

package app.h5.com.myapplication;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Bundle;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class MainActivity1 extends Activity {

    private WebView webView;
    Contact contact;
    @SuppressLint("JavascriptInterface")
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main1);
        //加载页面
        webView = (WebView) findViewById(R.id.webview);
        //允许JavaScript执行
        webView.getSettings().setJavaScriptEnabled(true);

        contact = new Contact();
        // 添加一个对象, 让JS可以访问该对象的方法, 该对象中可以调用JS中的方法，参数二为js里面对象名
        webView.addJavascriptInterface(contact, "contact");
        //最好不要在此调用，如果网页没有加载完毕，不能执行js方法
//        contact.showcontacts();
        webView.setWebViewClient(new WebViewClient(){
            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                //网页加载完成后，再调用js方法。
                contact.showcontacts();
            }
        });
        webView.loadUrl("file:///android_asset/index1.html");
    }

    private final class Contact {

	//注意Androidsdk17以上（不包括17），和js交互的方法必须加此注解 @JavascriptInterface 
        //JavaScript调用此方法拨打电话

	@JavascriptInterface

        public void call(String phone) {

//            startActivity(new Intent(Intent.ACTION_CALL, Uri.parse("tel:" + phone)));

            Toast.makeText(MainActivity1.this, phone, Toast.LENGTH_LONG).show();

        //此方法调用js方法show(string)，参数通过json传递

        @JavascriptInterface

        public void showcontacts() {

            String json = "[{\"name\":\"zxx\", \"amount\":\"9999999\", \"phone\":\"18600012345\"}]";

            // 调用JS中的方法

           webView.loadUrl("javascript:show('" + json + "')");

        //在js里面点击button，会调用此方法

        @JavascriptInterface

        public void toast(String str){

            Toast.makeText(MainActivity1.this, "aaaaaaaaaaaa  --- " + str, Toast.LENGTH_LONG).show();

}}

html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript">
    //此方法Android原生代码进行调用，参数为json字符串，插入一行数据，姓名、存款、电话
            function show(jsondata){
                    alert("show");
                    var jsonobjs = eval(jsondata);  
                    var table = document.getElementById("personTable");  
                    for(var y=0; y<jsonobjs.length; y++){  
                        var tr = table.insertRow(table.rows.length);   
                        var td1 = tr.insertCell(0);  
                        var td2 = tr.insertCell(1);  
                        td2.align = "center";  
                        var td3 = tr.insertCell(2);  
                        td3.align = "center";  
                        td1.innerHTML = jsonobjs[y].name;   
                        td2.innerHTML = jsonobjs[y].amount;
                        //点击此电话，调用Android原生代码的contact的call(str)方法
                        td3.innerHTML = "<a href='javascript:contact.call(\""+ jsonobjs[y].phone+ "\")'>"+ jsonobjs[y].phone+ "</a>";   
                    }  
            }  
        </script>
</head>

<!-- 请注意不要在html内直接调用Android代码，高版本Android sdk禁止此调用 -->
<!-- <body onload="javascript:contact.showcontacts()">此调用Android高版本禁止 -->
<body><!-- 点击此button，可以调用Android原生代码类的方法 -->

<button id="button" onclick = "javascript:contact.toast('123')">haha</button>
<table border="0" width="100%" id="personTable" cellspacing="0">
    <tr>
        <td width="30%">姓名</td>
        <td width="30%" align="center">存款</td>
        <td align="center">电话</td>
    </tr>
</table>
</body>
</html>

	//注意Androidsdk17以上（不包括17），和js交互的方法必须加此注解 @JavascriptInterface

点击电话号码，调用了contact类的方法，弹出电话号码。

我是阿荣荣

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录