Javascript 谷歌地图API信息窗口在提交前将lat和lng值输入表单隐藏字段

我试图将'lat'和'lng'值输入到信息窗口中嵌入的表单隐藏字段中。提交表单后，表单将调用一个函数，在发布之前将'lat'和'lng'值附加到隐藏字段中

但是，在尝试将'lat'和'lng'的值传递到隐藏字段时，我会遇到一些问题

//declare global variables
var map = null; 
var info_window = new google.maps.InfoWindow();

// handles the initial settings and styling for google maps 
function initialize() {
      var map_options = {
        zoom: 11,
        center: new google.maps.LatLng(1.35208, 103.81984),
        panControl: false,
        panControlOptions: {
        position: google.maps.ControlPosition.BOTTOM_LEFT
        },

        zoomControl: true,
        zoomControlOptions: {
        style: google.maps.ZoomControlStyle.LARGE,
        position: google.maps.ControlPosition.RIGHT_CENTER
        },
        scaleControl: false
      }

     map = new google.maps.Map(document.getElementById('map-canvas'), map_options); 
     //add marker to the event where the point of the map is clicked
     google.maps.event.addListener(map, 'click', function(event) { add_marker(event.latLng); });
} 


function add_marker(location) {
    map.markers = []; 
    //ensure that the map is initialized
    if(map != null) { 
        var marker = new google.maps.Marker({ 
        position: location, 
        map: map, 
        animation: google.maps.Animation.DROP });

        //listener on markers to listen for clicks/right clicks 
        google.maps.event.addListener(marker, 'rightclick', function(event) { marker.setMap(null); });
        google.maps.event.addListener(marker, 'click', function() { open_info(marker, location) });
        map.markers.push(marker); 
    }
}

function open_info(marker, location) {
    if(map != null) {
        //infowindow form that calls appendLatLng() before submit
        var content =   '<form method="post" action="main.php" onsubmit="return appendLatLng(location)" name="infoWindow" id="infoWindow">' +
                        '<input type="text" name="location" id="location" placeholder= "Location"/><br />' +
                        '<input type="textarea" name="description" id="description" cols="40" rows="5" placeholder="Description"/><hr />' +
                        '<input type="hidden" name="lat" id="lat" value=""/>' +
                        '<input type="hidden" name="lng" id="lng" value=""/>' +
                        '<input type="submit" name="save" id="save" value="Save" />' +
                        '</form>';


        info_window.setContent(content);
        info_window.open(map, marker);
    }
}

//append location.lat() and location.lng() to lat and lng fields
function appendLatLng(location){
    document.getElementById('lat').value = location.lat();
    document.getElementById('lng').value = location.lng();
}


google.maps.event.addDomListener(window, 'load', initialize);

//声明全局变量
var-map=null；
var info_window=new google.maps.InfoWindow（）；
//处理谷歌地图的初始设置和样式
函数初始化（）{
变量映射_选项={
缩放：11，
中心：新google.maps.LatLng（1.35208，103.81984），
泛控制：错误，
全控选项：{
位置：google.maps.ControlPosition.BOTTOM_左
},
动物控制：对，
ZoomControl选项：{
样式：google.maps.ZoomControlStyle.LARGE，
位置：google.maps.ControlPosition.RIGHT\u CENTER
},
scaleControl:false
}
map=new google.maps.map（document.getElementById（'map-canvas'），map\u选项）；
//向单击地图点的事件添加标记
google.maps.event.addListener（映射，'click'，函数（event）{add_marker（event.latLng）；}）；
} 
功能添加标记（位置）{
map.markers=[]；
//确保映射已初始化
如果（map！=null）{
var marker=new google.maps.marker（{
位置:位置,，
地图：地图，
动画：google.maps.animation.DROP}）；
//侦听器在标记上侦听单击/右键单击
google.maps.event.addListener（标记，'rightclick'，函数（事件）{marker.setMap（null）；}）；
google.maps.event.addListener（标记，'click'，function（）{open_info（标记，位置）}）；
map.markers.push（marker）；
}
}
功能打开信息（标记、位置）{
if（map！=null）{
//在提交前调用appendLatLng（）的infowindow窗体
变量内容=“”+
“
”+
“
”+
'' +
'' +
'' +
'';
信息窗口。设置内容（内容）；
信息窗口。打开（地图、标记）；
}
}
//将location.lat（）和location.lng（）追加到lat和lng字段
功能附件（位置）{
document.getElementById（'lat'）。value=location.lat（）；
document.getElementById（'lng'）。value=location.lng（）；
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

下面是main.php中的php代码段，它试图访问lat和lng值，但得到的是空值

    <?php
        if (!empty($_POST['location']) && !empty($_POST['description'])){
    ?>
        <h5><b>Name of Location:</b> <?=$_POST['location']?>
        <b>Description:</b> <?=$_POST['description']?> 
        <b>Longtitude:</b> <?=$_POST['lng']?>
        <b>Latitude:</b> <?=$_POST['lat']?></h5>    
    <?php
        }
    ?>

地点名称：
说明：
长期：
纬度：

我想知道在调用appendLatLng（）函数时传递“location”对象是否有问题。有人能帮我吗

---

非常感谢！：）

onsubmit处理程序不知道

位置

-变量，它将不会在

打开_info（）

的范围内执行（在onsubmit处理程序中

位置

将是一个DOMNode，ID为“location”的输入）

在准备表单时直接设置所需的值：

var content =   '<form method="post" action="main.php" name="infoWindow" id="infoWindow">' +
                '<input type="text" name="location" id="location" placeholder= "Location"/><br />' +
                '<input type="textarea" name="description" id="description" cols="40" rows="5" placeholder="Description"/><hr />' +
                '<input type="hidden" name="lat" id="lat" value="'+marker.getPosition().lat()+'"/>' +
                '<input type="hidden" name="lng" id="lng" value="'+marker.getPosition().lng()+'"/>' +
                '<input type="submit" name="save" id="save" value="Save" />' +
                '</form>';

var content=''+
“
”+
“
”+
'' +
'' +
'' +
'';

插入您的

附录（位置）在
信息窗口之后。打开（地图、标记）。出于测试目的，将输入id lat和lng设置为文本，您可以在单击标记时看到添加的值。
尝试放置
附录lng（位置）在
信息窗口之后。打开（地图、标记）并检查Inspect Element。