天天看點

ionic開發——百度地圖InfoWindow資訊視窗上添加按鈕,無法觸發點選事件問題解決辦法

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.οnclick=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上面添加可點選按鈕的方法,請告訴我!謝謝啦!!!

繼續閱讀