如何將我的 javascript 變量發送到 html 表單？

Question

我正在嘗試編寫一個小站點來獲取我的位置並自己添加一些變量，然后將這些數據保存在我的數據庫中。 問題是我無法將 javascript 中的變量中的數據發送到 html 中的表單中。 除了這個，其他一切都有效..

我試圖將 mylat、mylong 和 myacc 的值傳遞給我表單中的三個隱藏字段。 關於非編碼人員的任何建議？

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>


    <!-- Geolocation API, to bad accuracy -->

    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="http://maps.google.com/maps/api/js?sensor=true"></script>



    <script>

      x = navigator.geolocation;
      x.getCurrentPosition( success, failure, options );

      var options = {
        enableHighAccuracy: true,
        timeout: 30000,
        maximumAge: 30000 // If "0", new positions will be demanded
      };

      function success(position){

        //Fetch coordinates
        var mylat = position.coords.latitude;
        var mylong = position.coords.longitude;
        var myacc = position.coords.accuracy;
        $('#lat').html(mylat);
        $('#long').html(mylong);
        $('#acc').html(myacc);

        //Google-API-Ready latitude and longitue

        var coords = new google.maps.LatLng(mylat, mylong);

        //Setting up our Google map

        var mapOptions = {
          zoom: 16,
          center: coords,
          mapTypeId: google.maps.MapTypeId.SATELLITE
          }

        //Creating the map

        var map = new google.maps.Map(document.getElementById("map"), mapOptions);

        //Create a marker

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

      }

      function failure(){
        $('body').append("<p> Koordinater kunde inte läsas in </p> ");

      }


    </script>

    <style>

      #map {
        width: 400px;
        height: 400px;
      }

    </style>
    <p>Latitude : </p><div id="lat"></div>
    <p>Longitude : </p><div id="long"></div>
    <p>Accuracy (m): </p><div id="acc"></div>


  <body>


      <form name="form" action="x-form.php" method="POST" />


      <input type="hidden" name="Latitude" id="Latitude" value="'+window.mylat+'"/>
      <input type="hidden" name="Longitude" id="Longitude"  value="'+window.mylong+'"/>
      <input type="hidden" name="Accuracy" id="Accuracy" value="'+window.myacc+'"/>


      <p>Antal :<br>
        <input type="number" name="Number" min="0" max="500" /></p>
      <br>
      <p>Höjd :<br>
        <input type="double" name="Hight" min="0.0" max="50.0" />
      <br><br>
      <input type="submit" value="Skicka" />

    </form>


    <!-- Placeholder map -->
    <div id="map">

    </div>


  </body>
</html>

Answer 1

您可以使用jQuery val方法來設置輸入的值。 在您的情況下，您可以在設置顯示值的同一位置設置它們，如下所示：

$('#Latitude').val(mylat);
$('#Longitude').val(mylong);
$('#Accuracy').val(myacc);

Answer 2

在賦值時使用以下代碼。 我正在使用輸入類型 'name' 而不是 'id'

document.forms['form']['Latitude'].value=mylat; 
document.forms['form']['Longitude'].value=mylong; 
document.forms['form']['Accuracy'].value=myacc;

代替

$('#lat').html(mylat);
$('#long').html(mylong);
$('#acc').html(myacc);

如何將我的 javascript 變量發送到 html 表單？

問題描述

2 個解決方案

解決方案1
1 2015-09-15 12:45:10

解決方案2
0 2015-09-15 13:10:00

如何將我的 javascript 變量發送到 html 表單？

問題描述

2 個解決方案

解決方案1 1 2015-09-15 12:45:10

解決方案2 0 2015-09-15 13:10:00

解決方案1
1 2015-09-15 12:45:10

解決方案2
0 2015-09-15 13:10:00