1:Android端添加WebView控件,用于加载Html文件
WebView webView = new WebView(this);
setContentView(webView);
webView.setVerticalScrollBarEnabled(false);
webView.setHorizontalScrollBarEnabled(false);
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
settings.setDefaultTextEncodingName("utf-8");
webView.setWebViewClient(new WebClient());
webView.loadUrl("file:///android_asset/index.html");
2:显示JS中Alert对话框
如果JS方法中有Alert弹框,必须实现WebChromeClient中的方法才能正常显示
webView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsAlert(WebView view, String url, Stringmessage, JsResult result) {
return super.onJsAlert(view, url, message, result);
}
})
3:Html文件中内容
引用JS
<script type="text/javascript" src="People.js">script>
例:Body中添加标签
<input type="button" value="onCCEvent" οnclick="People.onCCEvent('ary1',1, 'EventLabel')"/>
People.js定义方法:
loadURL(url):创建内嵌框架添加到body的子节点,实时移除,释放内存
function loadURL(url) { var iFrame; iFrame = document.createElement("iframe"); iFrame.setAttribute("src", url); iFrame.setAttribute("style", "display:none;"); iFrame.setAttribute("height", "0px"); iFrame.setAttribute("width", "0px"); iFrame.setAttribute("frameborder", "0"); document.body.appendChild(iFrame); iFrame.parentNode.removeChild(iFrame); 移除iframe iFrame = null; }; exec(funName,args):Html标签点击事件后调用,将参数传入并将创建的内嵌框添加到body子节点 function exec(funName, args) { var commend = { functionName : funName, arguments : args }; var jsonStr = JSON.stringify(commend); var url = "People:" + jsonStr; loadURL(url); };
定义Html标签中引用的方法
var People = {
onCCEvent : function(evenArray, evenValue, eventLabel) { if (isWebviewFlag) { exec("onCCEvent", [ evenArray, evenValue, eventLabel ]); } }}
得到Java端数据并弹框显示
function setWebViewFlag (javaStr) {
alert(“setWebViewFlag”+javaStr); }}
4:Android与JS交互
Android端得到JS数据:
通过实现WebViewClient下的shouldOverrideUrlLoading(WebView view,String url)方法,其中url为Html返回的内容,得到后做对应处理即可
JS得到Android端数据:
webView.loadUrl(“javascript:setWebViewFlag(java端参数)”);
初次接触使用iframe实现与Android的交互的方法,亲测后立马贴出来共享下~