1

Hi I am currently using GoogleMaps API v3 and I am trying to get the variables for the latitude and longitude and place them in a hidden form as html variables and pass them through a form to a php page. The latitude and longitude are printing out on my page as the span but I cant get them to print in the form.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"       
    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <title>Untitled 1</title>

   <!-- google maps -->
   <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">        </script>

    <!-- jquery -->
   <script type="text/javascript" src="js/jquery.min.js"></script>

   <!-- jquery UI -->
   <script type="text/javascript" src="js/jquery-ui.min.js"></script>

   <!-- our javascript -->
   <script type="text/javascript" src="gmaps.js"></script>

   <link rel="stylesheet" type="text/css" href="style4.css" />


   </head>

   <body>

      <input id='gmaps-input-address' type='text'/>

    <div id='gmaps-error'></div>

    <div id='gmaps-canvas'></div>

      <br/>
      <br/>
    Latitude: <span id='gmaps-output-latitude'></span>
      <br/>
      Longitude: <span id='gmaps-output-longitude'></span>
      <br/>     

    <script type="text/javascript">

    function doSomething()
    {
    var lat = document.getElementById('#gmaps-output-latitude');
    lat_element.value = google_maps_api_variable;
    var lon = document.getElementById('#gmaps-output-longitude');
    lon_element.value = google_maps_api_variable;
    document.getElementById("lat").value=lat;
    document.getElementById("lon").value=lon;
    }
    </script>


   <form action="join.php" method="post" onSubmit="doSomething">

   <input type="hidden" name="lat" id="lat"/>
   <input type="hidden" name="lon" id="lon"/>

   <input type="submit" value="Confirm Address"/>
   </form>
   </body>


   </html>

In the Googlemaps API there is a javascript function which holds the latitude and longitude as follows:

function update_ui( address, latLng ) {
 $('#gmaps-input-address').autocomplete("close");
 $('#gmaps-input-address').val(address);
 $('#gmaps-output-latitude').html(latLng.lat());
 $('#gmaps-output-longitude').html(latLng.lng());
 }

I am very green with Javascript and would really appreciate any help, I have searched other questions to get as far as I am but I am stuck here.

4

2 に答える 2

1

既に持っているコードの後に​​これを追加するだけです（フォームがフォーム送信ボタンまたは何かのクリックハンドラーとして送信される前に機能するため）：

$('#lat').val($('#gmaps-output-latitude').html());
$('#lon').val($('#gmaps-output-longitude').html());
于 2012-08-22T15:20:54.703 に答える
0

gmaps.js は、html ファイルにスパンを設定する js です。これは、おそらく update_ui であると思われるコールバック関数を介して発生するはずです。この関数は後でスパンにデータを入力する可能性があり、非表示フィールドにデータを入力するためのスクリプトが既に実行されている可能性があります。そのため、コールバック関数呼び出しの後に非表示フィールドに入力するコードを配置するか、update_ui 自体に配置することができます。

update_ui 関数を編集して追加します

$('#lat').val(latLng.lat());
$('#lon').val(latLng.lng());

最後に、関数本体のこれらの行。

于 2012-08-22T15:22:22.220 に答える