0

このコードを使用してGoogleマップを取得しています。

    <style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0; padding: 0 }
  #map_canvas { height: 100% }
</style>
<script type="text/javascript"
    src="http://maps.googleapis.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
  function initialize() {
  var latlng = new google.maps.LatLng(52.000,17.1100);
    var myOptions = {
      zoom: 12,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
    });

  var infoWindow = new google.maps.InfoWindow({
    position: latlng,
    content: '<b>Theater Address:</b><br> <?php echo $row['address']; ?>'
  });
  infoWindow.open(map);
  }
</script>

そして、この html フォーム コードを使用して緯度と経度を入力しています。送信ボタンが 1 つあります。

<form  method="post" autocomplete="off">
        <p>
            <b>lat</b> <label>:</label>
            <input type="text" name="lat" id="lat" />
            <b>lon</b> <label>:</label>
            <input type="text" name="lon" id="lon" />
        </p>
        <input type="submit" value="Show location" />
    </form>

地図には他の緯度と経度がありますが、緯度と経度を入力した後に送信をクリックすると、緯度と経度も変更する必要があります。これを行うにはどうすればよいですか?

前もって感謝します.. :)

4

3 に答える 3

0

このフィドルをチェックしてください

次のコードで、dragond を必要なイベントに置き換えます。あなたの場合、「クリック」

google.maps.event.addListener(marker, 'dragend', function (event) {
    document.getElementById("defaultLatitude").value = event.latLng.lat();
    document.getElementById("defaultLongitude").value = event.latLng.lng();
});
于 2014-11-29T13:00:22.747 に答える
0

さまざまな方法でそれを行うことができます。

次の方法をお勧めします。

  1. マップを表示する別のメソッドを作成します。

    function re_create_map() {
      var latlng = new google.maps.LatLng(document.getElementById("lat").value,document.getElementById("lon").value);
                   map.setCenter(latlng);           
    }
    
      <input type="button" onclick="re_create_map()" value="Show location" />         
    

注*: このフォームを送信する必要がないため、input type="submit" を使用する必要はありません。これはクライアント側でのみ実現できます。

または、同じ目的を達成するために他の JavaScript トリックを試すこともできます。

于 2012-09-27T07:44:49.363 に答える