Question

这时我拖放标记。我写了lat，lng坐标创建了div。首先没有任何div。当我拖放标记时创建。我离开了标记，它将lat，lng值写入div内部。每次创建不同的div时，我都会拖放。 Div具有重新定位的类名。后来当我点击一个div。我无法获得div的价值。此外，当我单击一个创建的div我想移动标记lat，lng位置。我希望我能解释一下我的问题。你可以看看http://jsfiddle.net/QvNUF/1015/

<!DOCTYPE html>
<html>
<head>
<script src="http://maps.google.com/maps/api/js?sensor=false&.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body>
<div id="googleMap" style="width:500px;height:500px;"></div>
Lat: <input type="text" id="lat"><br>
Lng: <input type="text" id="lng"><br>
<button id="selected">Selected Coordinates</button>
<button id="clear">Clear history</button>
<div id="results" ></div>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(41.015137,28.979530);
var myOptions = {
  zoom: 10, 
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("googleMap"), myOptions);
addMarker(myLatlng, 'Default Marker', map);
map.addListener('click',function(event) {
    addMarker(event.latLng, 'Click Generated Marker', map);
});
}
function addMarker(latlng,title,map) {
var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: title,
        draggable:true
});
marker.addListener('drag',function(event) {
     $('#lat').val(event.latLng.lat())  ;
    $('#lng').val(event.latLng.lng())  ;
});
marker.addListener('dragend',function(event) {
    $('#lat').val(event.latLng.lat())  ;        
    $('#lng').val(event.latLng.lng())  ;
    var x=event.latLng.lat();
    var y=event.latLng.lng();
    $("#results").append('<div class="recenter">'+x+y+'</div>');
});
};  
    $('.recenter').click( function() {
        var a=$(this).text();
        alert(a);
    });
    $("#clear").click(function(){
        $("#results").text("");
        $("#results").hide();
    });
initialize();
</script>
</body></html>

Answer 1

在创建div之前添加.recenter的点击监听器，click()不会影响尚未创建的对象。

您可以在创建<div/>时直接添加点击监听器：

$("#results")
 .append($('<div>')
          .text(event.latLng.toUrlValue())
          .data('latlng',event.latLng)
          .click(function(){
                  marker.setPosition($(this).data('latlng'));
                 }));

http://jsfiddle.net/doktormolle/QvNUF/1022/

Answer 2

你需要marker.setPosition（latlng）此外，您还需要decalre marker，映射为代码上方的全局变量是的，我检查了你的小提琴。我知道你的div结构..只需在class after属性上添加onclick ="movemarker(x,y);"然后

function moveMarker(lat,lng) { 
//console.log("lat:"+x+" lng:"+y);
var latlng = new google.maps.LatLng(parseFloat(lat), parseFloat(lng)); marker.setPosition(latlng);
}

Google map api draggable marker

2 个答案: