获取用户输入的列的值

Question

<form id="form1" runat="server"> 

    <table border="1" id="ResultSheet"> 
     <tr id ="Name"> 
      <td> Student Name</td> 
      <td><input type="text" /></td> 
     </tr> 
     <tr> 
      <td>Subject Name</td> 
     </tr> 
     <tr> 
      <td>Maths</td> 
      <td><input type="text" /></td> 
     </tr> 
     <tr> 
      <td>Science</td> 
      <td><input type ="text" /></td> 
     </tr> 
     <tr> 
      <td>English</td> 
      <td><input type ="text" /></td> 
     </tr> 
    </table> 
</form> 

我有这张表，现在我想要得到每个输入类型的值。我如何得到它。

我已经试过：

document.getElementById("ResultSheet").rows[2].cells.item(0).innerHTML); 

但它并没有返回任何东西。

Answer 1

您可以使用querySelectorAll()，如：

document.querySelectorAll('#ResultSheet input'); 

环路通过如下所示的代码片段的结果。

希望这会有所帮助。

var inputs = document.querySelectorAll('#ResultSheet input'); 
 

 
for(var i=0;i<inputs.length;i++){ 
 
    console.log(inputs[i].value); 
 
}

<form id="form1" runat="server"> 
 
    <table border="1" id="ResultSheet"> 
 
     <tr id ="Name"> 
 
      <td> Student Name</td> 
 
      <td><input type="text" value="1"/></td> 
 
     </tr> 
 
     <tr> 
 
      <td>Subject Name</td> 
 
     </tr> 
 
     <tr> 
 
      <td>Maths</td> 
 
      <td><input type="text" value="2"/></td> 
 
     </tr> 
 
     <tr> 
 
      <td>Science</td> 
 
      <td><input type ="text" value="3"/></td> 
 
     </tr> 
 
     <tr> 
 
      <td>English</td> 
 
      <td><input type ="text" value="4"/></td> 
 
     </tr> 
 
    </table> 
 
</form>

Answer 2

使用<form>财产elements：https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/elements

例子：https://jsfiddle.net/8co9v0ye/