//js与webview交互初始化

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)

}

//关注按钮点击交互

setupWebViewJavascriptBridge(function (bridge) {

function followChange(data) {

if (data == 1) {

$(".btnFollow").removeClass("btnFollow-yes").addClass("btnFollow-no");

} else {

$(".btnFollow").removeClass("btnFollow-no").addClass("btnFollow-yes");

}

}

$(".btnFollow").click(function () {

var followStaus=1;

if ($(this).is('.btnFollow-no')) {

followStaus=1;

} else {

followStaus=2;

}

bridge.callHandler(

'callMobileHandler',

{"followStaus": followStaus, "deviceType": "ios"},

function (response) {

if(response.followStaus==1){

$(this).removeClass("btnFollow-yes").addClass("btnFollow-no");

}else{

$(this).removeClass("btnFollow-no").addClass("btnFollow-yes");

}

});

});

bridge.registerHandler('callJSHandler', function (data, responseCallback) {

followChange(data.followStaus);

// responseCallback(responseData);

});

//以上代码实现的功能可以正常运行,以下代码实现的功能没有生效

var imgs = document.getElementsByTagName("img");

//传递图片src数组

var imgsSrc=imgs.map(function (value,index) {

return value.src

});

bridge.callHandler(

'callMobileHandler',//名称待换

{"imgList": imgsSrc, "deviceType": "ios"},//参数待换

function (response) {//假设返回的src数组为imgList

for(var i = 0;i< response.imgList.length; i++){

imgs[i].src=response.imgList[i];

}

});

//js注册函数,没用可删除

/*bridge.registerHandler('callJSHandler', function (data, responseCallback) {

responseCallback(responseData);

});*/

//图片点击事件

for(var i = 0;i< imgs.length; i++){

imgs[i].onclick(function(){

bridge.callHandler(

'callMobileHandler',//名称待换

{"currentImg": imgs[i].src, "deviceType": "ios"},//参数待换

function (response) {

//内容待写

});

//js获得ios端参数函数,没用可删除

/*bridge.registerHandler('callJSHandler', function (data, responseCallback) {

responseCallback(responseData);

});*/

});

}

});

我想问一下我想写多个callhandle函数,是应该调用多次这个桥接函数呢,还是在一个函数里重复写几遍呢,或者是其他方法?目前只有第一个功能实现了,剩下的传递图片数组和图片点击事件都没有传递过去,该怎么办?

webviewjavascriptbridge android ios,js与ios交互使用WebViewJavascriptBridge如何写多个函数相关推荐

  1. iOS: JS和Native交互的两种方法,iosjsnative交互

    iOS: JS和Native交互的两种方法,iosjsnative交互 背景: UIWebView: iOS 用来展示 web 端内容的控件. 1. 核心方法: - (NSString*)string ...

  2. iOS JS与OC交互

    iOS JS与OC交互 本文内容导航 1.`UIWebView` JS 与 OC 交互 1.1 OC 调用 JS 函数 1.1.1 OC 拼接 JS 字符串调用 JS 方法 1.1.2 使用 JSCo ...

  3. Android极简的js与java交互库一一SimpleJavaJsBridge

    今日科技快讯 根据相关报道,本月底旧版本Uber中国App将全面停止在中国的服务.内部人士透露,所有的Uber中国司机也正在被转移到滴滴司机的平台上,月底会全部转移完成. 另外滴滴出行新成立了一个部门 ...

  4. iOS js oc相互调用(JavaScriptCore)(二)

    http://blog.csdn.net/lwjok2007/article/details/47058795 上节地址 http://blog.csdn.net/lwjok2007/article/ ...

  5. Android开发之android与JS互调 | Android与H5互调(附源码)

    我们先看下JS代码: <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...

  6. iOS下JS和原生交互,函数互调

    现在越来越多的APP都是H5和原生混合开发,这样确实方便快捷,但是H5的部分总避免不了很多与原生的交互,原生调JS函数还比较简单,原生的API函数stringByEvaluatingJavaScrip ...

  7. index android js,reactjs – React Native项目没有index.ios.js或index.android.js

    首先确保您已完成以下下载: > Java Sdk > Android Studio > Xcode(如果是OSX) > HomeBrew(在OSX的情况下安装节点) >节 ...

  8. video.js android,VideoJS + HTML5自动播放失败,适用于Android 2.3+和IOS 4+

    我的VideoJS和HTML5项目针对更新的Web浏览器(较新版本的FireFox和Chrome)以及移动浏览器(Android2.3 +和IOS4 +).VideoJS + HTML5自动播放失败, ...

  9. android 监听 h5 window,H5嵌入APP后,通过window.WebViewJavascriptBridge原生APP与H5之间交互...

    下面从H5的角度记录交互思路: 1:安卓环境和ios环境稍微有点不同,需要根据navigator.userAgent判断一下当前环境 2:仍然是APP环境不同,安卓需要进行兼容性判断,如果不存在win ...

最新文章

  1. 2021年春季学期-信号与系统-第十二次作业参考答案-第四小题
  2. Android 仿微信小视频录制
  3. 数据库连接池技术,c3p0
  4. [私]-optee的同步方法
  5. @RequestParam和@RequestBody
  6. golang string 加号连接性能慢_面试必备:浅析C#性能优化的若干种方法
  7. 目前8岁女儿上的课程
  8. iterator总结(未完)
  9. java线程--object.waitobject.notify
  10. ▲▲▲▲▲▲▲▲▲▲▲yum源的配置(本地和ftp)▲▲▲▲▲▲▲▲▲▲▲▲▲v...
  11. python实现PDF文件合并成一个文件
  12. ES的同义词、扩展词、停止词热更新方案
  13. 太极图形html5代码,HTML5 Canvas组件绘制太极图案
  14. 设计模式 装饰者模式 带你重回传奇世界
  15. win10 excel和ppt变成英文了,word正常,怎么解决?
  16. Linux中tar和scp
  17. 同学,你的系统吐司可能需要修复一下
  18. 路由器和调制解调器的区别_如何重新启动路由器和调制解调器
  19. 我国企业履行社会责任的措施
  20. 如何用html5制作抽奖游戏,原生js实现抽奖小游戏

热门文章

  1. 运行时异常和检查性异常区别
  2. python 获取系统相关编码的函数
  3. 小心使用STL中map的[]操作符
  4. python里clear和copy_python之字典
  5. 思考产品架构的4个视角:业务、场景、数据/功能、实现
  6. SVN还原与SVN更新区别
  7. 【APICloud系列|28】 UIChatBox 模块(聊天输入框)的实现
  8. canvas动画简单操作
  9. React后台管理系统-品类的增加、修改和查看
  10. 一篇文章搞定css3 3d效果