我目前正在尝试使用JS和HTML动态创建表。
但是目前看来,它似乎无法从用户输入中检索值。
我做错了什么?
提前致谢!
<script type="text/javascript">
function createTable(num_rows, numcols)
{
var num_rows = document.tablegen.rows.value;
var num_cols = document.tablegen.cols.value;
var theader = '<table>\n';
var tbody = '';
for( var i=0; i<num_rows;i++)
{
// create each row
tbody += '<tr>';
for( var j=0; j<num_cols;j++)
{
// create cell
tbody += '<td>';
tbody += 'Cell ' + i + ',' + j;
tbody += '</td>'
}
// closing row table
tbody += '</tr>\n';
}
var tfooter = '</table>';
// TO DO
return theader + tbody + tfooter;
}
</script>
</head>
<body>
<form name="tablegen">
<label>Rows: <input type="text" name="rows"/></label><br />
<label>Cols: <input type="text" name="cols"/></label><br/>
<input name="generate" type="button" value="Create Table!" onclick='createTable();'/>
</form>
<script type="text/javascript">
document.write(createTable());
</script>
最佳答案
我不建议使用document.write。读这个
Why is document.write considered a "bad practice"?
试试这个:
<script type="text/javascript">
function createTable()
{
var num_rows = document.getElementById('rows').value;
var num_cols = document.getElementById('cols').value;
var theader = '<table border="1">\n';
var tbody = '';
for( var i=0; i<num_rows;i++)
{
tbody += '<tr>';
for( var j=0; j<num_cols;j++)
{
tbody += '<td>';
tbody += 'Cell ' + i + ',' + j;
tbody += '</td>'
}
tbody += '</tr>\n';
}
var tfooter = '</table>';
document.getElementById('wrapper').innerHTML = theader + tbody + tfooter;
}
</script>
</head>
<body>
<form name="tablegen">
<label>Rows: <input type="text" name="rows" id="rows"/></label><br />
<label>Cols: <input type="text" name="cols" id="cols"/></label><br/>
<input name="generate" type="button" value="Create Table!" onclick='createTable();'/>
</form>
<div id="wrapper"></div>
您还可以使用
insertRow
和insertCell
。阅读更多:
https://developer.mozilla.org/en/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
http://www.w3schools.com/js/tryit.asp?filename=try_dom_table_insertrow
关于javascript - 用用户输入动态创建表,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/8182608/