android开发调用javascript的调试过程中,有时候需要使用onJsAlert来输出javascript方法的信息,以帮助我们进行问题定位。
覆写WebChromeClient的onJsAlert方法即可:
class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { Toast.makeText(MainActivity.this, message, Toast.LENGTH_SHORT).show(); return true; } }
private WebView mWebView;
mWebView = (WebView) findViewById(R.id.content_webview); mWebView.getSettings().setJavaScriptEnabled(true); mWebView.setHorizontalScrollBarEnabled(false); mWebView.setVerticalScrollBarEnabled(false); mWebView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY); mJsBridge = new JavascriptBridge(this, mWebView); mWebView.addJavascriptInterface(mJsBridge, "JSBrige"); mWebView.setWebChromeClient(new MyWebChromeClient());
html文件里弹出alert信息(我把usite.css\usite.js\usite.html都存放在android项目的asset目录下):
<!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="file:///android_asset/usite.css"/> <script type="text/javascript" src="file:///android_asset/usite.js"></script> <script type="text/javascript"> String.prototype.trim = function() { return this.replace(/^\s+/, '').replace(/\s+$/, ''); }; document.addEventListener("DOMContentLoaded", function() { alert("hello, I am a alert!"); loadData(); }, false); </script> </head> <body> <div id="title">{TITLE}</div> <div id="content">{CONTENT}</div> </body> </html>
很可惜的是,运行程序后只弹出了一次
而且后续的js方法无法继续进行。幸运的是,通过搜索,我们找到了问题的所在,需要在每次调完后设置参数JsResult调用cancel()或者confirm()方法,这样子:
class MyWebChromeClient extends WebChromeClient { @Override public boolean onJsAlert(WebView view, String url, String message, JsResult result) { Toast.makeText(DetailActivity.this, message, Toast.LENGTH_SHORT).show(); result.cancel(); return true; } }
问题就解决了。可以方便进行android和javascript方法的调试了。需要注意的一点是,html文件head引用.js文件的时候,格式应该是这样:
<scripttype="text/javascript"src=\'#\'" ///android_asset/usite.js"></script>
而不是
<scripttype="text/javascript"src=\'#\'" ///android_asset/usite.js"/>