使用Google Map时无法从表单输入文本框中获取价值吗？

Question

I using google map finder from demo ramirezcobos and I config:

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map;
var marker=false;
function initialize() {
    var myLatlng = new google.maps.LatLng(10.786599576864381, 106.69340372085571);

    var myOptions = {
        zoom: 16,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("gmap"), myOptions);

    marker = new google.maps.Marker({
        position: myLatlng, 
        map: map
    });

      google.maps.event.addListener(map, 'center_changed', function() {
        var location = map.getCenter();
        document.getElementById("latlng").value = location.lat()+ ', '+location.lng(); 
        placeMarker(location);
      });

      google.maps.event.addListener(map, 'zoom_changed', function() {
        zoomLevel = map.getZoom();
        document.getElementById("zoom_level").innerHTML = zoomLevel;
      });

      google.maps.event.addListener(marker, 'dblclick', function() {
        zoomLevel = map.getZoom()+1;
        if (zoomLevel == 20) {
            zoomLevel = 10;
        }    
        document.getElementById("zoom_level").innerHTML = zoomLevel; 
        map.setZoom(zoomLevel);
      });
      document.getElementById("latlng").value = 10.786599576864381+ ', '+106.69340372085571;
}

function placeMarker(location) {
    var clickedLocation = new google.maps.LatLng(location);
    marker.setPosition(location);
}

window.onload = function(){initialize();};

</script>
<div id="bd"><div id="gmap"></div></div>
<input type="text" name="latlng" id="latlng" value="" />   

When I using firebug is value not show in input[type="text"], It is null

<input id="latlng" type="text" value="" name="latlng">

How to fix it ?

Answer 1

You are setting the value- property of the element, to set a html- attribute (what is not the same), use setAttribute() :

document.getElementById("latlng").setAttribute('value',location.lat()+ ', '+location.lng()); 

...and you'll see the changes inside firebug's HTML-Tab.

But you also may inspect the properties of an element, select the element in the HTML-Tab and then on the right side you'll find all properties inside the DOM-tab.

However, in this case this should not affect your implementation, as long as you didn't try to read the value-property set via node.value='?' by using node.getAttribute('value') (or vice versa)