ionic开发——百度地图InfoWindow信息窗口上添加按钮,无法触发点击事件问题解决办法

时间:2021-06-28 06:51:24

ionic开发中,在使用百度地图的时候,有时我们需要在点击地图上标注的海量点弹出一个infowindow的信息窗口,自定义信息窗口的内容后,我们想要可以在信息窗口上面点击的时候,发现点击没有效果。

我们用chrome的开发者模式查看我们绑定的事件是已经绑定上的,可是还继承了两个ionic里面的方法,我们在调试工具中把这两个方法remove掉,发现我们自己绑定的事件就可以触发了。可能因为ionic和百度地图的信息窗口有冲突,解决办法没有找到,最后我选择了避开这个问题。

在信息窗口中,我们可以发现关闭按钮是可以点击的,所以我查看了关闭按钮所在的位置,关闭按钮在<div class="BMap_pop"></div>这个标签下,所以我选择了在关闭按钮的同级新建一个标签,定位在信息窗口上,来实现点击的目的。

在打开信息窗口的时候我们调用这个myClick方法

function myClick(fLng,fLat){
// alert($(".BMap_pop").length)
if($(".BMap_pop").length>0){//有BMap_pop证明信息窗口已经打开
var buttonobj=document.createElement("button"); '<button class="abcd" style="width: 70px;height: 30px;color:#FF6700;position: absolute;left: 200px;top: 64px;z-index: 10000;">去这里>></button>';
buttonobj.className = "gotohere"
buttonobj.innerHTML = "去这里";
buttonobj.style = "width: 70px;height: 30px;color:#FF6700;position: absolute;left: 200px;top: 64px;z-index: 10000;"
buttonobj.onclick=function(){
loadMapcallback(fLng,fLat);
}
var xxx = $(".BMap_pop");
xxx.remove(".gotohere");
if(1 > $(".gotohere").length){//防止重复添加button标签
xxx.append(buttonobj);
}else{}

}else{
myClick(fLng,fLat);
}
}


具体的定位位置和样式问题,大家根据自己的需求进行调试,如果大家有直接解决在infowindow上面添加可点击按钮的方法,请告诉我!谢谢啦!!!