Question

我有这个用于显示地理位置的HTML代码：

<span id="currentLat"></span>, <span id="currentLon"></span>

结合javascript代码，它完美无缺。问题是我想在文本字段中显示上面的值。

我确实尝试过：

<input id="" value="<span id="currentLat"></span>, <span id="currentLon"></span>" size="30" />

但它给了我错误。我如何将值添加到文本字段值？

NB：

我添加了用于确切知道代码错误的javascript代码，但可能代码无法在文本输入字段中工作。

<script>
      window.onload = function() {
        var startPos;

        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            startPos = position;
            document.getElementById("startLat").innerHTML = startPos.coords.latitude;
            document.getElementById("startLon").innerHTML = startPos.coords.longitude;
          }, function(error) {
            alert("Error occurred. Error code: " + error.code);
            // error.code can be:
            //   0: unknown error
            //   1: permission denied
            //   2: position unavailable (error response from locaton provider)
            //   3: timed out
          });

          navigator.geolocation.watchPosition(function(position) {
            document.getElementById("currentLat").innerHTML = position.coords.latitude;
            document.getElementById("currentLon").innerHTML = position.coords.longitude;
            document.getElementById("distance").innerHTML =
              calculateDistance(startPos.coords.latitude, startPos.coords.longitude,
                                position.coords.latitude, position.coords.longitude);
          });
        }
      };

      // Reused code - copyright Moveable Type Scripts - retrieved May 4, 2010.
      // http://www.movable-type.co.uk/scripts/latlong.html
      // Under Creative Commons License http://creativecommons.org/licenses/by/3.0/
      function calculateDistance(lat1, lon1, lat2, lon2) {
        var R = 6371; // km
        var dLat = (lat2-lat1).toRad();
        var dLon = (lon2-lon1).toRad();
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
                Math.cos(lat1.toRad()) * Math.cos(lat2.toRad()) *
                Math.sin(dLon/2) * Math.sin(dLon/2);
        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
        var d = R * c;
        return d;
      }
      Number.prototype.toRad = function() {
        return this * Math.PI / 180;
      }
    </script>

Answer 1

已更新，请参阅正在运行的代码

＆＃13;

<input value='<span id=\"currentLat\"></span>, <span id=\"currentLon\"></span>' size="30" />

 <input value="<span id='currentLat'></span>, <span id='currentLon'></span>" size="30" />

＆＃13;

如果你想设置宽度和高度，那么它应该是

  style="height:100px;width:200px"

Answer 2

你有错别字（ID属性的未闭合引号）。比你只需要设置span的内容，而不是整个元素。

<input id="result" value="" size="30" />

<script>

var res = document.getElementById('result');
var lat = document.getElementById('currentLat');
var lon = document.getElementById('currentLon'); 

res.value = lat.innerText + ', ' + lon.innerText;

</script>

https://jsfiddle.net/zc7pLcoq/

Answer 3

你需要正确地逃避它们 -

<select ng-model="bodyFont">
      <option ng-repeat="font in fonts" value="{{font}}" ng-style="{'font-family':font}>{{font}}</option>
 </select>

将id代码添加到输入值中

3 个答案: