这是个困扰我已久的问题。就是在百度地图的infowindow上添加一个按钮,点击按钮,调用自定义事件。

之前我的解决方案是:

这样是可以的,当我点击“查看详情”时,会调用detailMsg方法,但是后来发现一个问题:就是当我把infowindow窗口关闭,再次点击标注,试图打开infowindow时,会报错:

这个问题我始终找不到原因,也无法解决,后来我还是用回了老方法,就是用字符串的方式创建动态dom元素,如下:

但是这样始终都没办法监听到detailMsg事件,后来我把事件动态加载上去,如下:

这样的效果是页面刷新之后第一次点击的时候会报错:

当把infowindow关闭之后,第二次打开再点击的时候就是ok的,于是,我想可能是第一次点击的时候,元素还没有渲染到dom结构上,于是想用事件委托,将事件委托给父级元素,但是尝试之后发现这样是行不通的。

然后看到网上有人说infowindow添加事件要使用infowindow的open事件才行,于是尝试使用了如下代码:

可是这样做了之后效果是第一次点击有效,之后怎么点击都无效,哎,长路漫漫啊~~~

于是乎,我就把这两个结合了起来,但是那个报错依旧存在,所以我就想能不能第一次点击调用这个办法,以后就调用上边那个方法,那么问题来了,这个判断条件要怎么写呢?然后就去扒文档,在文档中发现了

经测试发现,这个isOpen只有在第一次点击的时候是false,其他时间都是true,到此问题得到解决。

代码如下:

百度地图infowindow上添加自定义点击事件相关推荐

  1. echarts 地图去除点击事件_echarts 取消图例上的点击事件和图表上鼠标滑过点击事件...

    备注:标黄的代码是起作用的代码,其他的不需要借鉴!!! //取消 鼠标滑过的提示框 tooltip : { trigger: 'item', show:false, formatter: " ...

  2. google地图--自定义标记以及点击事件

    之前做项目需要使用到地图,由于是做国外网站,所以考虑了几种地图之后,决定用谷歌地图.但是在完成某一需求时,碰到了问题:点击marker标记,弹出设计图上的内容.谷歌地图默认的弹框和设计图不符合,所有我 ...

  3. android vue.js点击反应慢,解决vue 界面在苹果手机上滑动点击事件等卡顿问题

    用vue编写项目接近尾声,需要集成到移动端中,在webstorm上界面,运行效果都很完美,但是在苹果手机上各种问题都出现了,原生项目一向滑动流畅,事件响应迅速,可是苹果手机打开这个项目有两个问题, ( ...

  4. vue移动端点击事件延迟_解决Vue 界面在苹果手机上滑动点击事件等卡顿问题_莺语_前端开发者...

    用 (1).滑动页面卡顿, (2).点击事件响应缓慢,百度才发现在苹果手机上有300ms的延迟. 一.滑动页面卡顿 //页面布局 页面内容 在对应的组件的最外层div上加上这样的样式: .conten ...

  5. 百度地图InfoWindow事件绑定

    最近用百度地图开发了一个功能,需要绑定marker的提示框InfoWindow的事件,用百度原先提供的API :addEventListener方法绑定事件没有任何反应. 处理方案: 1.引入 < ...

  6. 百度地图infowindow的close事件_百度地图蒙圈:车主要加油误导母婴店 跑偏理由令人啼笑皆非...

    常在江湖飘,哪有不挨刀.经常驾车出门在外的您,有过被导航坑的经历么?其实在早些年手机导航刚刚兴起的时候,这类现象确实比较常见,但是到了如今大数据的时代,手机导航数据更新比较及时,问题已经少了很多.不过 ...

  7. 百度地图infowindow的close事件_高德地图,百度地图,腾讯地图哪个更准?

    先说结论 高德第一,百度第二,腾讯第三 这些地图商,他们是怎么知道"我家门口新开了一家咖啡店"这一事件的,并且标注上去还拍了照片呢?有些店新开了,有些店倒闭了,10年以前这条街上的 ...

  8. 百度地图Mark 点自动点击 触发mark点击事件

    this.map.getOverlays() //这个是获取mark点的集合 可以打印出来看一下 然后直接结果 //下面这行是触发点击事件的代码!!!this.map.getOverlays()[0] ...

  9. 百度地图之添加覆盖物并响应事件

    随时随地技术实战干货,获取项目源码.学习资料,请关注源代码社区公众号(ydmsq666) 本文中将介绍在百度地图上添加覆盖物的功能.响应点击功能和弹出pop功能,代码来自百度Demo: Activit ...

  10. 百度地图InfoWindow信息窗口的自定义和样式修改

    最近捣腾百度地图,在做标志物点击事件显示信息窗口时,发现官方的信息窗口只给了固定的样式,且比较普通.那么该如何想修改成自己想要的样式? 1.在官方给出的原基础上进行修改 了解这种方法有助于你理解官方的 ...

最新文章

  1. 基于mpi的奇偶排序_并行程序设计(第2版)pdf
  2. python监听文件更改记录_如何用机器人监听老板微信?
  3. 去除源文件中的重复行的程序流程及其C代码实现
  4. 邮件 自动打印 linux,Unix / Linux基本实用程序-打印,电子邮件
  5. 机器视觉 · 工业镜头
  6. linux几个常用的环境变量配置文件
  7. 推荐搜索系统论文干货集锦(持续更新)
  8. python Anaconda2安装OpenCV2
  9. eclipse 查找
  10. 【java】深入探讨 Java 类加载器
  11. Python数据清洗处理,csv,pandas,数据匹配
  12. 微信朋友圈 腾讯服务器,朋友圈@微信能得一面红旗?腾讯服务器一度宕机
  13. Excel筛选出符合自己条件的数据
  14. 【数据分析报告】携程客户分析与流失预测
  15. c语言编程怎么样,C语言怎么样,好学吗?
  16. 为什么那么多公司在用快速开发平台开发软件?下表说明了一切
  17. 基于密度聚类算法的改进
  18. 无人机倾斜摄影测量影像处理关键技术
  19. 百度AI的时代献礼:与央视搭AI秀台,让万物智能样貌清晰可见
  20. 第三章习题2存款利息的计算

热门文章

  1. mac用什么软件测试硬盘好坏,8款最好的免费Mac工具,检测和修复常见macOS问题
  2. hp104w打印机连接无线
  3. web前端学习(三)——HTML5的字体、特殊符号、插入图片及头部元素的相关标签设置
  4. 面试自我介绍3分钟通用计算机专业,面试自我介绍3分钟
  5. 小猫钓鱼纸牌游戏java_纸牌游戏----小猫钓鱼
  6. 怎么将CAD图纸转化为PDF格式呢?教你两个妙招搞定!
  7. 用户流失生命周期如何最大化延缓或延长(包含引流-促活-问卷调研-流失召回话术)
  8. 你写论文时发现了哪些神网站?
  9. 有效沟通沟通的9大技巧
  10. 解决Chrome浏览器无法加载flash插件的问题