webview和js互動

來源:互聯網
上載者:User

標籤:enabled   conf   padding   call   pos   script   rom   wav   hand   

public class WebViewDemo extends Activity {    private static final String LOG_TAG = "WebViewDemo";    private WebView mWebView;    private Handler mHandler = new Handler();    @Override    public void onCreate(Bundle icicle) {        super.onCreate(icicle);        setContentView(R.layout.main);        mWebView = (WebView) findViewById(R.id.webview);        WebSettings webSettings = mWebView.getSettings();        webSettings.setSavePassword(false);        webSettings.setSaveFormData(false);        webSettings.setJavaScriptEnabled(true);        webSettings.setSupportZoom(false);        mWebView.setWebChromeClient(new MyWebChromeClient());        mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");        mWebView.loadUrl("file:///android_asset/demo.html");    }    final class DemoJavaScriptInterface {        DemoJavaScriptInterface() {        }        /**         * 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()");                }            });        }    }    /**     * 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) {            Log.d(LOG_TAG, message);            result.confirm();            return true;        }    }}


demo.html
<html>    <script language="javascript">        /* This function is invoked by the activity */        function wave() {            alert("1");            document.getElementById("droid").src="android_waving.png";            alert("2");        }    </script>    <body>        <!-- Calls into the javascript interface for the activity -->        <a onClick="window.demo.clickOnAndroid()"><div style="width:80px;            margin:0px auto;            padding:10px;            text-align:center;            border:2px solid #202020;" >                <img id="droid" src="android_normal.png"/><br>                Click me!        </div></a>    </body></html>


①android如何調用js。
調用形式:
mWebView.loadUrl("javascript:wave()");載入js中的wave()方法

②js如何調用android。
調用形式:
<a onClick="window.demo.clickOnAndroid()">

代碼中的“demo”是在android中指定的調用名稱,即
mWebView.addJavascriptInterface(new DemoJavaScriptInterface(), "demo");

代碼中的clickOnAndroid()是“demo”對應的對象:new DemoJavaScriptInterface() 中的一個方法。

③雙向互動。



webview和js互動

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.