快捷導(dǎo)航

android中WebView和javascript實(shí)現(xiàn)數(shù)據(jù)交互實(shí)例

更新時(shí)間：2014年07月11日 10:25:55 投稿：junjie

這篇文章主要介紹了android中WebView和javascript實(shí)現(xiàn)數(shù)據(jù)交互實(shí)例,需要的朋友可以參考下

在看懂這篇文章之前首先要有javascript基礎(chǔ)。

(1) js調(diào)用android的方法：

WebView wView；

wView. addJavascriptInterface (Object obj, String interfaceName);

是實(shí)例化一個(gè)對(duì)象，在html的js中調(diào)用，第二個(gè)參數(shù)是實(shí)例化對(duì)象的別名，如果要使用這個(gè)obj，則在js中使用的名字
就是interfaceName。

復(fù)制代碼代碼如下:

public class jsWebDemo extends Activity {
WebView wView；

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        wView = (WebView)findViewById(R.id.wv1);

       WebSettings wSet = wView.getSettings();
        wSet.setJavaScriptEnabled(true);

        ProxyBridge pBridge = new ProxyBridge();
        wView.addJavascriptInterface(pBridge, "AliansBridge");

        wView.loadUrl("file:///android_asset/index.html");

    }

private class ProxyBridge {
public int one () {
   return 1;
}
}

}

來(lái)看一下index.html的內(nèi)容：

復(fù)制代碼代碼如下:

<a onClick="window.demo.clickOnAndroid()">
<div style="width:100px;
            margin:0px auto;
            padding:10px;
            text-align:center;
            border:2px solid #202020;" >
                <img id="droid" src="android_normal.png" mce_src="android_normal.png"/><br>
                Click me!
        </div>
</a>
<input type="submit" value="change to 1" onclick="document.getElementById('output').innerHTML

=AliansBridge.one()" />
</body>
</html>

這里的AliansBridge即是調(diào)用的JAVA對(duì)象。
要注意的是，如果你只有一個(gè)方法需要被js調(diào)用只new一個(gè)對(duì)象就行：
ProxyBridge pBridge = new ProxyBridge();
wView.addJavascriptInterface(pBridge, "AliansBridge");
如果你需要調(diào)用好多個(gè)方法，就要把整個(gè)android程序所在的類本身實(shí)例化傳遞進(jìn)去：
wView.addJavascriptInterface(this, "AliansBridge");
(2) android調(diào)用js的方法：wView.setWebChromeClient (WebChromeClient client)
要用到Handler更新UI，Handler mHandler = new Handler()；

復(fù)制代碼代碼如下:

mWebView.setWebChromeClient(new MyWebChromeClient());                

    mWebView.addJavascriptInterface(new Object(){

    /**      

     * This is not called on the UI thread. Post a runnable to invoke      

     * loadUrl on the UI thread.      

     */        

    public void clickOnAndroid() {        

        mHandler.post(new Runnable() {         

            public void run() {         

                mWebView.loadUrl("javascript:wave()");         

            }         

        });                 

    } 

 }, "demo");

同理，在html中必須有一個(gè)名為demo的對(duì)象調(diào)用clickOnAndroid()方法。

復(fù)制代碼代碼如下:

/**      

 * Provides a hook for calling "alert" from javascript. Useful for      

 * debugging your javascript.      

 */        

final class MyWebChromeClient extends WebChromeClient {         

    @Override     

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

            JsResult result) {                      

        result.confirm();       

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

    } 

}

您可能感興趣的文章: