javascript - 使用谷歌地图标记坐标作为表单输入

Question

从下面的 javascript 函数中，当用户单击 map 上的某个位置时，我得到一个带有坐标的 javascript 变量 ma​​rker。

var marker;
function placeMarker(location) {
  if ( marker ) {
    marker.setPosition(location);
  } else {
    marker = new google.maps.Marker({
      position: location,
      map: map
    });
  }
}
google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
});

问题如何将这些坐标用作表单输入？

<form method="POST" action="/authors" target="" enctype="multipart/form-data">
   ...
</form>

Answer 1

您所要做的就是获取 location 变量并将其分配给您的表单输入，如下所示:

首先，添加一个隐藏的输入框

<form method="POST" action="/authors" target="" enctype="multipart/form-data">
   <input id="location" name="location" type="hidden" value="" />
</form>

其次，确保将位置变量添加到您的输入中

var marker;
function placeMarker(location) {
  if ( marker ) {
    marker.setPosition(location);
  } else {
    marker = new google.maps.Marker({
      position: location,
      map: map
    });
  }

  $("#location").val(location);

}
google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
});

现在，每当 placeMarker(location) 被调用时，它都会用“location”的 id 更新输入，它的值是 location 的输出。