讀取帶有VALUE屬性（及其值）的INPUT標記的HTML表單的innerHTML

我有一個htmlform帶有一些輸入字段。讀取帶有VALUE屬性（及其值）的INPUT標記的HTML表單的innerHTML

代替讀出和通過document.ipForm.userName.value發送input字段的值，我需要發送整個HTML內容的HTML解析器和提取<name ,value>對每個輸入字段的一些其他程序（和其它信息太）。

但是，當我在JavaScript這樣做（我想純Javascript成爲沒有其他庫）

var contents=document.getElementById("formArea").innerHTML; 
alert(contents);

它亙古不變的節目即使我輸入了一些值<input/>的value="enteredValue"領域。

我的HTML文件：

<html> 
<head> 
    <script type="text/javascript"> 
    function showInnerHtml(){ 
     var contents=document.getElementById("formArea").innerHTML; 
     alert(contents); 
    } 
    </script> 
</head> 
<body> 
    <div id="formArea"> 
     <form name="ipForm" > 
      UserName : <input type="text" name="userName"> 
     </form> 
    </div> 
    <div> other contents..... </div> 
    <div onclick="showInnerHtml()">Show InnerHTML</div> 
</body> 
</html>

我失去了一些東西在這裏或這是不可能的。

不要叫我MAD。但我正在爲這種奇怪的狀況而苦苦掙扎。

來源

2011-09-29 gtiwari333

至於我知道，.innerHTML中的'value =「」'東西永遠不會反映你在頁面加載後輸入到輸入字段中的內容。它只會包含頁面加載時value =「」中的內容。 –

是的。你是對的。它的工作原理是 – gtiwari333

這是因爲value是填充文本框時的屬性，而不是屬性。這意味着.value可以正常工作，但它不屬於實際DOM的一部分（如<input value="...">）。

你需要明確地設置它：http://jsfiddle.net/BkjhZ/。

var elems = document.getElementsByName("ipForm")[0].getElementsByTagName("input"); 

for(var i = 0; i < elems.length; i++) { 
    // set attribute to property value 
    elems[i].setAttribute("value", elems[i].value); 
}

來源

2011-09-29 18:41:36 pimvdb

。並感謝您的http：//jsfiddle.net/......從未聽說過。看起來不錯 – gtiwari333

您也可以編寫一個輸入，這將改變他的自身屬性，像這樣：

(...) 

UserName : <input type="text" name="userName" onChange="this.setAttribute('value', this.value);">

而對於複選框：

onClick="if (this.checked) { this.setAttribute('checked', null); } else { this.removeAttribute('checked'); }"

享受:)

來源

2015-11-23 19:08:16 Jerry

讀取帶有VALUE屬性（及其值）的INPUT標記的HTML表單的innerHTML

回答

相關問題