html追加到textarea

我一直在這段代碼上獲得一個定時器的地理定位10秒，結果將顯示在文本區域。問題是如何在不替換舊的結果的情況下添加新的結果，並且如果需要可以自動擴展textarea。html追加到textarea

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>HTML that display geolocation</title> 
</head> 
<body> 
    <textarea rows="50" cols="100" id="demo"></textarea> 

    <script> 
     var x = document.getElementById("demo"); 
     var timer = setInterval(function() { getLocation() }, 10000); 

     function getLocation() 
     { 
      if (navigator.geolocation) 
      { 
       navigator.geolocation.getCurrentPosition(success, error) 
      } 
      else 
      { 
       x.innerHTML = "Geoloaction is not supported." 
      } 
     } 

     function success(pos) 
     { 
      var y = pos.coords; 
      var z = new Date().toLocaleTimeString(); 
      x.innerHTML = z + " Latitude: " + y.latitude + " Longitude" + y.longitude; 
     } 

     function error(err) 
     { 
      switch (error.code) 
      { 
       case error.PERMISSION_DENIED: 
        x.innerHTML = "User denied the request for Geolocation." 
        break; 
       case error.POSITION_UNAVAILABLE: 
        x.innerHTML = "Location information is unavailable." 
        break; 
       case error.TIMEOUT: 
        x.innerHTML = "The request to get user location timed out." 
        break; 
       case error.UNKNOWN_ERROR: 
        x.innerHTML = "An unknown error occurred." 
        break; 
      } 
     } 
    </script> 
</body> 
</html>

來源

2015-05-09 Jerry

感謝您的回答，+ =絕對有幫助。如果我想在每個條目的末尾添加換行符，會發生什麼情況，因此它們都像列表一樣排列。感謝您的投入。 – Jerry

jsfiddle DEMO

您使用value爲textarea沒有innerHTML。然後，您可以使用+=向其追加文本。

var mTextArea = document.getElementById("demo"); 
mTextArea.value = "Some text."; 
mTextArea.value += " Some other text.";

現在，如果你得到textarea的價值將是

console.log(mTextArea.value);

一些文本。一些其他文字。

編輯：

爲了使textarea的自動您需要設置其height其scrollHeight擴大。

function resizeTextArea(elm) { 
    elm.style.height = elm.scrollHeight + 'px'; 
}

因此，如果文本被添加到textarea的編程，然後只需調用函數以後像resizeTextArea(mTextArea);

如果你想讓它作爲你然後鍵入調整：

var mTextArea = document.getElementById('demo'); 

mTextArea.addEventListener('keyup', function() { 
    this.style.height = this.scrollHeight + 'px'; 
});

編輯2：

要開始一個新行，請使用"\n"。

「這是第一行。\ n這是第二行。」

來源

2015-05-09 02:43:31 Samurai

天啊，我怎麼能忘記\ n ....非常感謝你的投入，完全解決了我所有的問題。 – Jerry

使用+=而不是=追加內容到你設置x.innerHTML textarea的：

function success(pos){ 
    var y = pos.coords; 
    var z = new Date().toLocaleTimeString(); 
    x.innerHTML += z + " Latitude: " + y.latitude + " Longitude" + y.longitude; 
}

來源

2015-05-09 02:37:10

我可以看到，你是不是在那裏使用jQuery所以.append是不是一種選擇爲你。

您的解決方案，你可以按照下列步驟操作：

獲取textarea的內容並把它放在一個變量。
連接你試圖附加到變量（txt_area_content + new_to_append）
清除該textarea的內容，然後把你已經連接的內容。

來源

2015-05-09 02:38:41

html追加到textarea

回答

相關問題