首先做一个终端判断
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
然后直接上代码
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 = 'https://__bridge_loaded__';
document.documentElement.appendChild(WVJBIframe);
setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
console.log(1)
}
/*与OC交互的所有JS方法都要放在此处注册,才能调用通过JS调用OC或者让OC调用这里的JS*/
// 点击地址打开地图
$('.hero-top-btn').click(function(){
if (isAndroid) { //安卓
// alert('isAndroid',isAndroid)
console.log(2)
var param = {
}
console.log(JSON.stringify(param))
window.android.invitFunc(JSON.stringify(param))
// connectWebViewJavascriptBridge (function(bridge) {
//
// //客户端已经注册好一个名为“ObjC Echo”的方法,H5直接进行调用(方法名也为“ObjC Echo”)就行,调用的时候可以传客户端需要的参数
// bridge.callHandler('invitFunc', {'latitude': parseFloat(mapLocalObj.lat),'longitude': parseFloat(mapLocalObj.lon),'shopName': mapLocalObj.shopName, 'address': mapLocalObj.address}, function responseCallback(responseData) {
// console.log("JS received response:", responseData)
// })
// })
}
if (isiOS) { // iOS
// alert('isiOS', isiOS)
setupWebViewJavascriptBridge(function(bridge) {
var uniqueId = 1
function log(message, data) {
var log = document.getElementById('log')
var el = document.createElement('div')
el.className = 'logLine'
el.innerHTML = uniqueId++ + '. ' + message + ':<br/>' + JSON.stringify(data)
if (log.children.length) {
log.insertBefore(el, log.children[0])
} else {
log.appendChild(el)
}
}
// /* Initialize your app here */
//
// /*我们在这注册一个js调用OC的方法,不带参数,且不用ObjC端反馈结果给JS:打开本demo对应的博文*/
bridge.registerHandler('openWebviewBridgeArticle', function() {
log("openWebviewBridgeArticle was called with by ObjC")
})
/*JS给ObjC提供公开的API,在ObjC端可以手动调用JS的这个API。接收ObjC传过来的参数,且可以回调ObjC*/
bridge.registerHandler('getUserInfos', function(data, responseCallback) {
log("Get user information from ObjC: ", data)
responseCallback({'userId': '123456', 'blog': '123'})
})
/*JS给ObjC提供公开的API,ObjC端通过注册,就可以在JS端调用此API时,得到回调。ObjC端可以在处理完成后,反馈给JS,这样写就是在载入页面完成时就先调用*/
bridge.callHandler('invitFunc', {}, function(response) {
log('JS got response', response)
})
})
}
})
这里面的代码直接可以复制,什么都不用改变
要注意的是
invitFunc 这个方法,是自定义的,需要告诉android和ios这个方法名,方便他们调用
param 这个对象里面的参数,可以为空也可以传值,看你们具体的业务需要