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

Answer 6

对于未来的读者来说，这是一个完整的演示代码片段，可以正常工作...（基于公认的答案）

还可以设置第二个函数来显示第二个单元格（如果单击）的值-显示如何从下一个单元格访问该值。

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

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

 }
 
 function showFont(tableID) {
     var tbl = document.getElementById(tableID);
     var rCount = tbl.rows.length;
     try {
         alert(tbl.rows[rCount-1].cells[1].children[0].value); // Note changed to cell[1] for the next cell

     } 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="Show Text Value" onclick="showText('dataTable')" />
     <INPUT type="button" value="Show Font Value" onclick="showFont('dataTable')" />

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

6 个答案: