JS與原生互相調用

JS與原生互相調用

1.iOS的調用

第一步：pod 'WebViewJavascriptBridge'

第二步： #import "WebViewJavascriptBridge.h"

第三步： 如圖在頁面中加載webview 和 建立橋樑bridge

第四步：OC調用JS裏的方法 ========
首先：在js文件裏面註冊方法如圖所示

然後：具體實現方法寫在下面，如圖所示

最後：在iOS文件裏面，調用js的方法如圖所示

以上就可以實現OC調用JS

第五步：JS調用OC裏的方法 ========
首先：OC文件裏面註冊方法如圖所示

然後：在html文件裏面寫三個按鈕去調用方法，如圖所示

最後：在js裏面實現按鈕的點擊事件，去調用OC的方法，如圖所示

以上就是JS調用OC方法的詳細步驟

2.安卓的調用

安卓調用js，js不用特意寫，直接寫function就可以了
js調用安卓就是 window.JSBridge.testJScallOC3(param); 具體安卓代碼我也不懂

下面粘貼一下js裏面必寫的那段代碼，其他我就不貼了

function setupWebViewJavascriptBridge(callback) {
    if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }
    if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
    window.WVJBCallbacks = [callback];
    var WVJBIframe = document.createElement('iframe');
    WVJBIframe.style.display = 'none';
    WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
    document.documentElement.appendChild(WVJBIframe);
    setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
}