如何檢索HTML表單元素並在頁面上的其他位置顯示值

我沒有經驗，所以很抱歉，如果這是一個愚蠢的問題，但我四處張望，我還沒有找到適合我的答案。我正在使用JavaScript，並且我有一個帶有一個文本輸入的html表單。當某人爲該輸入輸入一個值並提交表單時，我想返回到相同的HTML頁面，但是他們輸入的內容顯示在頁面的其他位置。這裏是我的形式：如何檢索HTML表單元素並在頁面上的其他位置顯示值

<form name="chatInput" action="index.html" method="get"> 
     chat:<input type="text" name="chat"/> 
</form>

我看到一些關於有：

var chatText = document.forms[0].elements[0];

但是當我嘗試使用此我得到[對象HTMLInputElement]

而且我只想要創建如果表格已經輸入一次，但最初沒有輸入，則爲變量。我將如何檢查這個？

感謝您的任何信息。

來源

2012-10-29 Jon Haller

如果你談論的是一個標準的形式提交（不阿賈克斯），爲什麼你會不會與服務器端的代碼，而不是JavaScript做到這一點？ – nnnnnn

你應該看看jQuery;它會隨着時間的流逝最終爲您節省很多麻煩。 – frenchie

您可以閱讀[HTML5規範中的表單]（http://dev.w3.org/html5/spec/single-page.html#the-form-element）。也有許多在線資源，如Mozilla的[Gecko DOM參考]（https://developer.mozilla.org/en-US/docs/DOM/HTMLFormElement）可以幫助填補空白。 – RobG

如果您不想再更新HTML，我建議不使用表單標籤。

相反，我會創建一個onclick屬性的按鈕。

<input type="button" value="Update" onclick="someFunction()">

然後在JS部分，有這樣的東西。

var someFunction = function(){ 
    var chatText = document.getElementById("this-is-the-element-I-want").value; 
}

當然，請確保元素，您正試圖獲取信息從有一個id。

<input type="text" name="chat" id="this-is-the-element-I-want">

編輯：代碼縮進和清晰度

來源

2012-10-29 03:11:09

這對我有用，謝謝！當我點擊'enter'而不是點擊一個按鈕時，我確實想運行這個函數，但是我使用onkeypress參數來處理文本輸入。 –

試試這個：

var chatText = document.forms[0].elements[0].value;

來源

2012-10-29 03:06:41

var chatText = document.forms[0]['chat'].value;

http://jsfiddle.net/XLeAn/

來源

2012-10-29 03:08:20 xandercoded

如何檢索HTML表單元素並在頁面上的其他位置顯示值

回答

相關問題