Web编程 订阅所有【Web编程】的日志

百度地图点击Marker同时触发Map的click事件解决方法

编辑:dnawo 日期:2020-06-13

字体大小: 小 中 大
在页面上添加个百度地图，地图上添加了一个Marker，并且给Map和Marker都添加了click事件处理程序：

复制内容到剪贴板程序代码 程序代码
// 添加地图
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(120.128132,30.228835), 13);
map.addEventListener("click", function(){
  alert("map");
});
// 添加标注点
var marker = new BMap.Marker(new BMap.Point(120.140421,30.222657));
marker.addEventListener("click", function(){
   alert("marker");
});
map.addOverlay(marker);

测试发现了问题：点击Marker时，不仅触发了Marker的click事件处理程序，还同时触发了Map的click事件处理程序，怎么解决这个问题呢？

翻阅百度地图开放平台《Javascript API》，Map对象click事件参数为"{type, target, point, pixel, overlay}"，利用overlay参数，我们只需在Map处理程序增加判断如果当前位置有覆盖物则不执行后续程序即可：

复制内容到剪贴板程序代码 程序代码
map.addEventListener("click", function(e){
  if(e.overlay){
    return; // 存在覆盖物退出
  }
  alert("map");
});


上一篇: 百度地图应用密钥AK不被其他网站非法调用的设置方法
下一篇: ASP.NET接收AjAx+FormData传送的文件实现文件上传示例
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志:
评论: 0 | 引用: 0 | 查看次数: 6991
发表评论
请登录后再发表评论！