如何讀取表格內的文本框的值

以下是我如何創建表。

var theader = '<table border = "1" id = "MarksTable">\n'; 
var tbody = ''; 

for (var i = 0; i < total_rows; i++) { 
    tbody += '<tr>'; 
    for (var j = 0; j < total_col; j++) { 
     tbody += '<td name=' + "cell" + i + j + '>'; 
     if (i > 0) { 
      tbody += '<input type="text" value = "marks" name="inputcell1'+j + '">'; 
     } else { 
      tbody += '<b>' + subjectList[j] + '</b>'; 
     } 
     tbody += '</td>'; 
    } 
    tbody += '</tr>\n'; 
} 
var tfooter = '</table>'; 
document.getElementById('wrapper').innerHTML = theader 
     + tbody + tfooter ;

以下是我嘗試讀取文本框的值：

function readTableData(){ 
    var marks = []; 
    var table = document.getElementById("MarksTable"); 
    var column_count = table.rows[1].cells.length; 
    var row = table.rows[1]; 
    if(column_count>0){ 
     for(var index = 0; index < column_count;index++){ 
      marks[index] = row.cells[index].innerHTML; 
     } 
    } 
    return marks; 
}

這裏，row.cells[index].innerHTML給出了輸出'<input type="text" value = "marks" name="inputcell10">。

來源

2013-06-29 Kanishka Gupta

你試過'value'，而不是'innerHTML'？ – luk2302

如果您已爲文本框提供了'name'屬性，則可以直接使用document.getElementsByName（'tboxname'）。value來獲取該值。 –

@ luk2302是的，我也嘗試了值，但它給了'undefined'作爲結果 –

試試這個：

function readTableData(){ 
    var marks = []; 
    var table = document.getElementById("MarksTable"); 
    var column_count = table.rows[1].cells.length; 
    var row = table.rows[1]; 
    if(column_count>0){ 
     for(var index = 0; index < column_count;index++){ 
      marks[index] = row.cells[index].getElementsByName('inputcell' + index)[0].value; 
    //Or marks[index] = document.getElementsByName('inputcell' + index)[0].value; 
     } 
    } 
    return marks; 
}

來源

2013-06-29 10:35:48

<!DOCTYPE html> 
<html> 
<head> 
<style> 
table, td { 
    border: 1px solid black; 
} 
</style> 
</head> 
<body> 

<p>Click the button to add a new row at the first position of the table and then add cells and content.</p> 
<div id="tableContainer"> 

</div> 
<br> 

<button onclick="myFunction()">Try it</button> 
<button onclick="readTableData()"> Read it </button> 
<script> 
function myFunction() { 
    var tab = '<table id="MarksTable">'; 
    var counter = 0; 
    for(i = 0; i< 4; i++){ 
     tab = tab + '<tr><td rowspan = "4"> Dept1 </td><td> <input type="text" id="inputcell'+counter+'" value="'+i+'"/> </td></tr>'; 
     counter++; 
     tab = tab+'<tr><td> <input type="text" id="inputcell'+counter+'" value="'+i+'"/> </td></tr>'; 
     counter++; 
     tab = tab+'<tr><td> <input type="text" id="inputcell'+counter+'" value="'+i+'"/> </td></tr>'; 
     counter++; 
     tab = tab+'<tr><td> <input type="text" id="inputcell'+counter+'" value="'+i+'"/> </td></tr>'; 
     counter++; 
    } 
    tab = tab + '</table>'; 
    document.getElementById("tableContainer").innerHTML = tab; 
} 

function readTableData(){ 
    var val; 
    var table = document.getElementById("MarksTable"); 
    var column_count = table.rows[1].cells.length; 
    var rowcount = table.rows.length; 
    alert(rowcount); 
    if(column_count>0){ 
     for(var index = 0; index < rowcount;index++){ 
      var row = table.rows[index]; 
      val = document.getElementById("inputcell"+index); 
      alert(val.value); 

      //marks = row.cells[0].getElementsByName('inputcell').value; 
    //Or marks[index] = document.getElementsByName('inputcell' + index)[0].value; 
     } 
    } 
    alert(val); 
} 
</script> 

</body> 
</html>

來源

2015-06-02 11:14:53

如何讀取表格內的文本框的值

回答

相關問題