2012-06-25 87 views
0

我想在地圖上有一個默認標記來表示地址,而用戶可以將用戶標記拖動到他們認爲正確的地方。 (在某些地圖整改情況適用...)如何在Google Map infowindow中觸發事件?

<script type="text/javascript"><!-- 
var geocoder; 
var map; 
var point; 
function mapLoad() { 
geocoder = new google.maps.Geocoder(); 
var myOptions = { 
    zoom: 16, 
    mapTypeControl: false, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 

map = new google.maps.Map(document.getElementById("map"), myOptions); 
var address = "LS2 2RD"; //default postcode 
geocoder.geocode({ 'address':address,region:"UK",language:"en"}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
    point=results[0].geometry.location; 
    map.setCenter(point); 
    var defaultMarker = new google.maps.Marker({map: map, position: point}); //default marker 
    var marker = new google.maps.Marker({ 
     map: map, 
     position: point, 
    draggable: true 
    }); //The marker for users to drag 

    var DefaultContent ='<h4>Default Location</h4><h6>You can drag it to anywhere you think it is right or confirm here is the right place</h6><div class="confirm"><input type="button" value="This location is correct"></div>' 
    var DefaultInfo = new google.maps.InfoWindow({content: DefaultContent,maxWidth:200}); 
    DefaultInfo.open(map,marker); //default infowindow 

     var TargetContent='<h4>New Location</h4><h6>Are you sure here is the right place?</h6><div class="confirm"><input type="button" value="Yes, I confirm" />'+ 
     '<input type="button" value="Cancel" onclick="clsMark()" /></div>'; //here cancel button is not working 
     var infobox = new google.maps.InfoWindow({content: TargetContent}); //after drag ended, the new infowindow 

google.maps.event.addListener(marker, 'drag', function(){ 
     DefaultInfo.close(); 
     }); 
google.maps.event.addListener(marker, 'dragend', function() { 
     infobox.open(map, marker); 
    }); 

function clsMark(){if (infobox != null) {infobox.close();}//if user cancel, clear the infowindow, and put the marker back to default position 
     marker.setPosition(point);} 

    } else { 
    alert("Geocode was not successful for the following reason: " + status); 
    } 
}); 

}

的問題是,我不能讓那些按鈕,在信息窗口的工作。如果我的onclick添加到一個按鈕,就像上面的代碼,在這種情況下,它說:「clsMark沒有定義」

google.maps.event.addListener(buttonID, 'click', function(){...} 

我得到的功能沒有定義的錯誤:我不能click事件綁定到使用按鈕。

所以我完全不知道如何讓按鈕在infowindow中工作。請幫我...

回答

1

您在聲明clsMark()函數傳遞給geocoder.geocode(匿名函數),這就是爲什麼它不是在全球範圍內(其中onclick處理程序正在尋找可用它)。

嘗試移動函數clsMark()之前調用geocoder.geocode以使onclick處理程序可見。

至於你嘗試使用'addListener(buttonID,..',注意addListener不能與ID一起使用,你必須提供'object'作爲第一個參數,所以這隻適用於使用google地圖對象。

相關問題