2011-09-29 66 views
6

Tôi có một số htmlform với một số trường nhập.đọc innerHTML của biểu mẫu HTML với VALUE thuộc tính (& giá trị của nó) của các thẻ INPUT

Thay vì đọc và gửi giá trị của input trường theo document.ipForm.userName.value, tôi cần gửi toàn bộ nội dung html tới trình phân tích cú pháp html và trích xuất từng cặp đầu vào của một chương trình khác (và các thông tin khác).

Nhưng khi tôi đã làm điều này trong JavaScript (i muốn tinh khiết JavaScript- không thư viện khác)

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

doesnot show các value="enteredValue" của <input/> lĩnh vực thậm chí nếu tôi bước vào một số giá trị.

HTML My File:

<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> 

Am i thiếu một cái gì đó ở đây hoặc đây là không thể.

Đừng gọi tôi là MAD. nhưng tôi đang đấu tranh với điều kiện kỳ ​​lạ này.

+2

As far as Tôi biết, công cụ 'value =" "' in .innerHTML sẽ không bao giờ phản ánh những gì bạn đã nhập vào trường nhập sau khi trang đã tải. Nó sẽ chỉ chứa những gì đã có trong giá trị = "" tại thời điểm trang được tải. –

+0

có. bạn đúng rồi. – gtiwari333

Trả lời

11

Đó là vì value là thuộc tính khi hộp văn bản được điền vào, không phải thuộc tính. Điều này có nghĩa là .value hoạt động tốt, nhưng nó không phải là một phần của DOM thực tế dưới dạng thuộc tính (như <input value="...">).

Bạn cần đặt rõ ràng: 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); 
} 
+0

nó hoạt động. và cảm ơn http: //jsfiddle.net/... chưa bao giờ nghe nói đến. trông mát mẻ – gtiwari333

0

Bạn cũng có thể viết một đầu vào mà nó sẽ đổi thuộc tính của mình, như thế này:

(...) 

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

Và đối với hộp kiểm sau:

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

Enjoy :)

Các vấn đề liên quan