2011-09-29 6 views
6

Ho un htmlform con alcuni campi di input.lettura innerHTML di modulo HTML con attributo VALUE (e il suo valore) di tag INPUT

Invece di leggere e inviare i valori dei campi da inputdocument.ipForm.userName.value, ho bisogno di inviare l'intero contenuto html html parser ed estrarre il <name ,value> coppia di ogni campo di input da qualche altro programma (e con altri messaggi).

Ma quando ho fatto questo in JavaScript (voglio puro JavaScript- non altra libreria)

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

E doesnot spettacoli le value="enteredValue" di <input/> campi, anche se ho inserito alcuni valori.

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

Mi manca qualcosa qui o questo non è possibile.

Non chiamarmi MAD. ma sto lottando con questa strana condizione.

+2

Per quanto riguarda Lo so, il valore "value =" "" in .innerHTML non rifletterà mai ciò che hai inserito in un campo di input dopo che la pagina è stata caricata. Conterrà solo ciò che era presente nel valore = "" nel momento in cui la pagina è stata caricata. –

+0

si. hai ragione. – gtiwari333

risposta

11

Questo perché value è una proprietà quando la casella di testo è compilata, non un attributo. Ciò significa che .value funziona correttamente, ma non fa parte del DOM effettivo come attributo (come <input value="...">).

È necessario impostarlo in modo esplicito: 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

ha funzionato. e grazie per http: //jsfiddle.net/... mai sentito parlare. sembra fico – gtiwari333

0

Si può anche scrivere un ingresso che cambierà per sé il suo attributo, in questo modo:

(...) 

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

E per caselle di controllo:

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

Enjoy :)

Problemi correlati