Android与JS交互---内嵌框架iframe

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的交互的方法，亲测后立马贴出来共享下~