2

我从数据库中获取坐标并在谷歌地图上显示相应的位置，它工作正常但是当我通过按钮点击坐标时它就不起作用了。这是我的代码：

 function load() {


      var map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(10.5167,7.4333),
        zoom: 13,
        mapTypeId: 'roadmap'
      });
      var infoWindow = new google.maps.InfoWindow;
       // click event
       google.maps.event.addListener(map, 'click', function(e) {


    document.getElementById('txtlat').value=e.latLng.lat() ;
    document.getElementById('txtlong').value=e.latLng.lng();

  });
      // Change this depending on the name of your PHP file
      downloadUrl("xmlcustloc.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
           var des = markers[i].getAttribute("des");

          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<b>" + name + "</b> <br/>"+des ;
          var icon = customIcons['simple'] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            shadow: icon.shadow
          });
          bindInfoWindow(marker, map, infoWindow, html);
        }
      });
    }

    function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }

    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }

    function doNothing() {}

上面的代码工作正常但是当我通过按钮点击坐标然后地方没有显示这里是我的按钮点击代码：

$(function() { 

 $("#btncheck").click(function() {  
   var lat=document.getElementById('txtlat').value;
   alert(lat);
        var lng=document.getElementById('txtlong').value; 
        alert(lng);
       var point = new google.maps.LatLng(lat,lng);

          var icon = customIcons['search'] || {};
          var marker = new google.maps.Marker({
            map: map,
            id: 'markerShowHide',
            position: point,
            icon: icon.icon,
            shadow: icon.shadow
          });
    }); 
});

感谢您提供的任何帮助。谢谢！

4

1 回答 1

2

我已经根据您的代码构建了一个简单的 jsFiddle，但没有 Ajax 调用。

var map;
function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng(10.5167,7.4333),
        zoom: 8,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    google.maps.event.addListener(map, 'click', function(e) {
        latInput.value = e.latLng.lat() ;
        longInput.value = e.latLng.lng();
    });
}

var latInput = document.getElementById('lat');
var longInput = document.getElementById('long');

function addMarker(){
    var lat = latInput.value;
    var long = longInput.value;

    if(!lat || !long) return;

    var coords = new google.maps.LatLng(lat,long);
    var marker = new google.maps.Marker({
        map: map,
        position: coords
    });
}

google.maps.event.addDomListener(document.getElementById('go'), 'click', addMarker);
google.maps.event.addDomListener(window, 'load', initialize);

jsFiddle

于 2013-07-26T13:03:05.837 回答