Examples_08_07

时间：2021-09-22 21:19:56

http://yarin.iteye.com/?page=4

Activity01.java

package com.yarin.android.Examples_08_07;

import android.app.Activity;

import android.os.Bundle;

import android.webkit.JavascriptInterface;

import android.webkit.JsResult;

import android.webkit.WebChromeClient;

import android.webkit.WebView;

public class Activity01 extends Activity {

    private WebView mWebView;

    private PersonalData mPersonalData;

    /** Called when the activity is first created. */

    @Override

    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.main);

        mPersonalData = new PersonalData();

        mWebView = (WebView) this.findViewById(R.id.WebView01);

        // 设置支持JavaScript

        mWebView.getSettings().setJavaScriptEnabled(true);

        // 把本类的一个实例添加到js的全局对象window中，

        // 这样就可以使用window.PersonalData来调用它的方法

        mWebView.addJavascriptInterface(this, "PersonalData");

        // 如果不设置这个，JS代码中的按钮会显示，但是按下去却不弹出对话框

        // Sets the chrome handler. This is an implementation of WebChromeClient

        // for use in handling JavaScript dialogs, favicons, titles, and the

        // progress. This will replace the current handler.

        mWebView.setWebChromeClient(new WebChromeClient() {

            @Override

            public boolean onJsAlert(WebView view, String url, String message,

                    JsResult result) {

                // TODO Auto-generated method stub

                return super.onJsAlert(view, url, message, result);

            }

        });

        // 加载网页

        // mWebView.loadUrl("file:///android_asset/PersonalData_new.html");

        mWebView.loadUrl("file:///android_asset/PersonalData.html");

    }

    // 在js脚本中调用得到PersonalData对象

    @JavascriptInterface

    public PersonalData getPersonalData() {

        return mPersonalData;

    }

    // js脚本中调用显示的资料

    class PersonalData {

        String mID;

        String mName;

        String mAge;

        String mBlog;

        public PersonalData() {

            this.mID = "123456789";

            this.mName = "Android";

            this.mAge = "100";

            this.mBlog = "http://yarin.javaeye.com";

        }

        public String getID() {

            return mID;

        }

        public String getName() {

            return mName;

        }

        public String getAge() {

            return mAge;

        }

        public String getBlog() {

            return mBlog;

        }

    }

}

PersonalData_new.html

<html>

    <head>

        <script type="text/javascript">

        function showAndroidToast(toast)

        {

            var personaldata_new = PersonalData.getPersonalData();

            alert(personaldata_new);

            var personaldata = window.PersonalData.getPersonalData();

            if(personaldata)

            {

                    var Personaldata = document.getElementById("Personaldata");

                pnode = document.createElement("p");

                tnode = document.createTextNode("ID:" + personaldata.getID());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                    tnode = document.createTextNode("Name:" + personaldata.getName());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                tnode = document.createTextNode("Age:" + personaldata.getAge());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                tnode = document.createTextNode("Blog:" + personaldata.getBlog());

                pnode.appendChild(tnode);

                    Personaldata.appendChild(pnode);

            }

        }

               function myFunction(){

                   console.log("Write a new Line");//调试信息

                   alert("Hello World!");

               }

        </script>

</head>

<body>

    <div id = "Personaldata">

        <p> Personal Data </p>

        <button onclick="myFunction()">click here!</button>

        <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" />

    </div>

</body>

</html>

PersonalData.html

<html>

    <head>

        <script type="text/javascript">

           function onload(){

            var personaldata = window.PersonalData.getPersonalData();

            if(personaldata)

            {

                var Personaldata = document.getElementById("Personaldata");

                pnode = document.createElement("p");

                tnode = document.createTextNode("ID:" + personaldata.getID());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                tnode = document.createTextNode("Name:" + personaldata.getName());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                tnode = document.createTextNode("Age:" + personaldata.getAge());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

                pnode = document.createElement("p");

                tnode = document.createTextNode("Blog:" + personaldata.getBlog());

                pnode.appendChild(tnode);

                Personaldata.appendChild(pnode);

            }

        }

        </script>

</head>

<body onload="javascript:onload()">

    <div id = "Personaldata">

        <p> Personal Data </p>

    </div>

</body>

</html>

或者

<html>

    <head>

        <script type="text/javascript" src="test2.js">

        </script>

</head>

<body onload="javascript:myFunction()">

    <div id = "Personaldata">

        <p> Personal Data </p>

        <button onclick="myFunction()">click here!</button>

    </div>

</body>

</html>

test2.js

function myFunction(){

var personaldata = window.PersonalData.getPersonalData();

    if(personaldata)

    {

        var Personaldata = document.getElementById("Personaldata");

    pnode = document.createElement("p");

        tnode = document.createTextNode("ID:" + personaldata.getID());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Name:" + personaldata.getName());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Age:" + personaldata.getAge());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Blog:" + personaldata.getBlog());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    }

}

或者

<html>

    <head>

        <script type="text/javascript" src="test2.js">

        </script>

</head>

<body><!-- onload="javascript:myFunction()"-->

    <div id = "Personaldata">

        <p> Personal Data </p>

        <button onclick="myFunction()">click here!</button>

    </div>

</body>

</html>

test2.js

window.onload= function(){

var personaldata = window.PersonalData.getPersonalData();

    if(personaldata)

    {

        var Personaldata = document.getElementById("Personaldata");

    pnode = document.createElement("p");

        tnode = document.createTextNode("ID:" + personaldata.getID());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Name:" + personaldata.getName());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Age:" + personaldata.getAge());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    pnode = document.createElement("p");

        tnode = document.createTextNode("Blog:" + personaldata.getBlog());

        pnode.appendChild(tnode);

        Personaldata.appendChild(pnode);

    }

}

<script type="text/javascript" src="test2.js"/>android2.2兼容，但是android4.1.2不兼容。下面的才兼容android4.1.2

<script type="text/javascript" src="test2.js"></script>

4.2及以上版本必须在js调用的java方法加上@JavascriptInterface，4.1及以下版本不用加上注释。

相关文章