Javascript动态表
我遇到了问题，下表中的每个框都应该是r1c1、r1c2、r2c1、r2c2等等，用户应该只能选择12行12列，上面的任何内容都应该显示错误消息。这是到目前为止我的代码Javascript动态表,javascript,dynamic,html-table,Javascript,Dynamic,Html Table,我遇到了问题，下表中的每个框都应该是r1c1、r1c2、r2c1、r2c2等等，用户应该只能选择12行12列，上面的任何内容都应该显示错误消息。这是到目前为止我的代码 <!DOCTYPE html> <!-- written by Angela Bauer on 1/23/2013--> <!-- saved from url=(0014)about:internet --> <html>
<!DOCTYPE html>
<!-- written by Angela Bauer on 1/23/2013-->
<!-- saved from url=(0014)about:internet -->
<html>
<head>
<meta charset = "utf-8">
<title> Dynamic Table </title>
<script type = "text/javascript">
var width = 500;
var height = 500;
function CreateTable(txtRows, txtCols, hold)
{
if(validNumber(txtRows) && validNumber(txtCols)
&& (hold != null) && (hold.canHaveChildren))
{
hold.innerHTML = "";
var table = document.createElement("table");
table.border = 3;
table.borderColor = "Blue";
table.height = height;
table.width = width;
var row = null;
var cell = null;
hold.appendChild(table);
for(i=0; i<txtRows; i++)
{
row = appendR(table)
for(j=0; j<txtCols; j++)
{
cell = appendC(row);
cell.innerText = j;
cell = null;
}
row = null;
}
}
}
function appendR(table)
{
if(table != null)
{
return table.insertRow();
}
else
{
alert("Error while creating table. Cause: Container Table is null!");
}
}
function appendC(aRow)
{
if(aRow != null)
{
return aRow.insertCell();
}
else
{
alert("Error while creating table. Cause: Container row is null!");
}
}
function validNumber(ipNum)
{
if(isNaN(ipNum))
{
alert("Invalid Number!");
return false;
}
else if(ipNum <= 1)
{
alert("You can only enter a number from 1 - 12!");
return false;
}
else
{
return true;
}
}
</script>
</head>
<body>
<table>
<tr>
<td> How many Rows would you like: </td>
<td><input type=text name=txtRows value=1 /></td>
</tr>
<tr>
<td> How many Columns would you like: </td>
<td><input type=text name=txtCols value=1 /> </td>
</tr>
<tr>
<td colspan=10 align=right><input type=button name=cmdCreate value="Create Table"
onClick="CreateTable(txtRows.value, txtCols.value, divHolder)" /></td>
</tr>
</table>
<div id=divHolder></div>
</body>
</html>
动态表
var宽度=500；
var高度=500；
函数CreateTable（txtRows、txtCols、hold）
{
if（validNumber（txtRows）和&validNumber（txtCols）
&&（hold！=null）和（hold.canHaveChildren））
{
hold.innerHTML=“”；
var table=document.createElement（“表”）；
表1.3=3；
table.borderColor=“蓝色”；
table.height=高度；
表1.width=宽度；
var行=null；
var-cell=null；
hold.appendChild（表）；
对于（i=0；i，正如gdoron所说的，您需要问一个问题，但我只是打了个赌，我猜您希望代码得到修复
下面是你的代码的工作副本。有很多错误，包括
- 输入框上没有ID
- “否”用于HTML表单中项目的值
- .insertRow缺少一个参数
- .insertCell缺少一个参数
- 如果您输入了
第一
- canHaveChildren仅在IE中有效，我已将其删除，但如果您的
脚本将仅在IE中使用，然后将其添加回
最佳做法应避免的事项：
使用单词table、row等作为var名称
我猜这是你的新想法，所以我的建议是安装Firefox和firebug插件，因为它会告诉你一半的错误。
此外，如果它没有达到您想要的效果，请向代码的各个部分添加警报，并确定它到达或未到达的位置
希望这能让你走上正轨
<html>
<head>
<meta charset = "utf-8">
<title> Dynamic Table </title>
<script type = "text/javascript">
var width = 500;
var height = 500;
function createTable(txtRows, txtCols, hold) {
// alert (txtRows+", "+txtCols+", "+hold);
// alert (hold.canHaveChildren);
// Removed as its an IE only javascript ---- && (hold.canHaveChildren)
if(validNumber(txtRows) && validNumber(txtCols) && (hold != null) ) {
// alert ("is valid");
hold.innerHTML = "";
var table1 = document.createElement("table");
table1.border = 3;
table1.borderColor = "Blue";
table1.height = height;
table1.width = width;
var row1 = null;
var cell1 = null;
hold.appendChild(table1);
for(i=0; i<txtRows; i++) {
// alert ("first for");
row1 = appendR(table1, i);
for(j=0; j<txtCols; j++) {
// alert ("second for");
cell1 = appendC(row1, j);
cell1.innerText = j;
cell1 = null;
}
row1 = null;
}
}
}
function appendR(table1, i) {
if(table1 != null) {
return table1.insertRow(i);
} else {
alert("Error while creating table. Cause: Container Table is null!");
}
}
function appendC(aRow, j) {
if(aRow != null) {
return aRow.insertCell(j);
} else {
alert("Error while creating table. Cause: Container row is null!");
}
}
function validNumber(ipNum) {
if(isNaN(ipNum)) {
alert("Invalid Number!");
return false;
} else if(ipNum > 12) {
alert("You can only enter a number from 1 - 12!");
return false;
} else if(ipNum < 1) {
alert("You can only enter a number from 1 - 12!");
return false;
} else {
return true;
}
}
</script>
</head>
<body>
<table>
<tr>
<td> How many Rows would you like: </td>
<td><input id="txtRows" type="text" name="txtRows" value="1" /></td>
</tr>
<tr>
<td> How many Columns would you like: </td>
<td><input id="txtCols" type="text" name="txtCols" value="1" /> </td>
</tr>
<tr>
<td colspan=10 align=right><input type=button name=cmdCreate value="Create Table"
onClick="createTable(txtRows.value, txtCols.value, divHolder)" /></td>
</tr>
</table>
<div id="divHolder"></div>
</body>
动态表
var宽度=500；
var高度=500；
函数createTable（txtRows、txtCols、hold）{
//警报（txtRows+”、“+txtCols+”、“+hold”）；
//警惕（保持。可以有孩子）；
//作为仅限IE的javascript删除---&&（hold.canHaveChildren）
if（validNumber（txtRows）&&validNumber（txtCols）&&（hold！=null））{
//警报（“有效”）；
hold.innerHTML=“”；
var table1=document.createElement（“表”）；
表1.3=3；
表1.borderColor=“蓝色”；
表1.高度=高度；
表1.宽度=宽度；
var row1=null；
var-cell1=null；
保留。追加儿童（表1）；
对于（i=0；我为我造成的混乱感到抱歉，但是的，我需要帮助，而且显然需要很多帮助！非常感谢！