如何在动态表中检索输入类型的值

Question

 function showContent(tableID) {
         var tbl = document.getElementById(tableID);
         var rCount = tbl.rows.length;
         try {
             alert(tbl.rows[rCount - 1].cells[0].innerHTML);

         } catch (e) {
             alert(e);
         }

     }

<table border="1" id="dataTable">
       <tr>
          <td>
              <Strong>Text</Strong>
          </td>
          <td>
              <Strong>Font</Strong>
          </td>
          <td>
              <Strong>Size</Strong>
          </td>
          <td>
              <Strong>Color</Strong>
          </td>
          <tr>
          <td>
              <input type="Text">
          </td>
          <td>
               <input type="Text">
          </td>
          <td>
                <input type="Text">
          </td>
          <td>
                <input type="Text">
          </td>
        </tr>
       </tr>
     </table>
     <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
     <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />       
     <INPUT type="button" value="Show" onclick="showContent('dataTable')" />

好的，我有一张像这样的桌子

 <table border="1" id="dataTable">
   <tr>
      <td>
          <Strong>Text</Strong>
      </td>
      <td>
          <Strong>Font</Strong>
      </td>
      <td>
          <Strong>Size</Strong>
      </td>
      <td>
          <Strong>Color</Strong>
      </td>
      <tr>
      <td>
          <input type="Text">
      </td>
      <td>
           <input type="Text">
      </td>
      <td>
            <input type="Text">
      </td>
      <td>
            <input type="Text">
      </td>
    </tr>
   </tr>
 </table>
 <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />
 <INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" />       
 <INPUT type="button" value="Show" onclick="showContent('dataTable')" />

我已经设置了JavaScript，所以我可以添加一行，删除一行工作正常，但我在尝试获取输入类型内部的值时遇到了实际问题。

这是我试图获取其中一个值的代码

  function showContent(tableID) {
     var tbl = document.getElementById(tableID);
     var rCount = tbl.rows.length;
     try {
         alert(tbl.rows[rCount - 1].cells[0].innerHTML);

     } catch (e) {
         alert(e);
     }

 }

然而，警报框只是提出：

 <input type="Text">

我想检索输入框内的实际值。谁能告诉我我做错了什么？

提前致谢。

Answer 1

那么你甚至都没有尝试获取价值......

alert(tbl.rows[rCount-1].cells[0].children[0].value);

Answer 2

alert(tbl.rows[rCount - 1].cells[0].getElementsByTagName("input")[0].value);

Answer 3

您需要在单元格中访问输入对象。你只是在看它里面的HTML。

试试tbl.rows[rCount - 1].cells[0].children[0].value;

Answer 4

function neeminhoud3(){
    var tabel = document.getElementById('tableDiagnose');
    var rijen = tabel.rows.length;

    for (i = 0; i < rijen; i++){
        var inputs = tabel.rows.item(i).getElementsByTagName("input");
        var inputslengte = inputs.length;

        for(var j = 0; j < inputslengte; j++){
            var inputval = inputs[j].value;                
            alert(inputval);
        }            
    }      
}

如果你想从表中获取所有输入字段

Answer 5

要获得所有输入，您应该执行以下操作：

function get(tableId) {
// returns an array for the values of all input elements in the last row of given table
    var t = document.getElementById(tableId);
    var r = t.rows[t.rows.length-1];
    var inputs = r.getElementsByTagName("input");
    var result = new Array(inputs.length);
    for (var i=0; i<inputs.length; i++)
        result[i] = inputs[i].value; // not innerHTML or something
    return result;
}