写的td的数量不够,所以不对齐。
在线演示<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>
</head>
<body>
<input id="btn" type="submit" value="插入"/>
<form action="">
<table id="glhdtable" width="500" border="1">
<tr>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
</tr>
</table>
</form>
<script type="text/javascript">
var btn = document.getElementById('btn')
var table = document.getElementById('glhdtable');
var hdlength = 3;
btn.onclick = function(){
for(var i = 0; i < hdlength; i++){
var tr = document.createElement('tr')
var td1 = document.createElement('td');
td1.innerHTML = '<input type="checkbox" value="1" onclick="ccb()" id="glhdcheckbox2" name="glhdcheckbox2">';
tr.appendChild(td1); var td2 = document.createElement('td');
tr.appendChild(td2);
var td3 = document.createElement('td');
tr.appendChild(td3);
var td4 = document.createElement('td');
tr.appendChild(td4);
var td5 = document.createElement('td');
tr.appendChild(td5);
}
table.tBodies[0].appendChild(tr);
} function ccb(){
console.log(11);
}
</script>
</body>
</html>
在线演示<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>
</head>
<body>
<input id="btn" type="submit" value="插入"/>
<form action="">
<table id="glhdtable" width="500" border="1">
<tr>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
</tr>
</table>
</form>
<script type="text/javascript">
var btn = document.getElementById('btn')
var table = document.getElementById('glhdtable');
var hdlength = 3;
btn.onclick = function(){
for(var i = 0; i < hdlength; i++){
var tr = document.createElement('tr')
var td1 = document.createElement('td');
td1.innerHTML = '<input type="checkbox" value="1" onclick="ccb()" id="glhdcheckbox2" name="glhdcheckbox2">';
tr.appendChild(td1); var td2 = document.createElement('td');
tr.appendChild(td2);
var td3 = document.createElement('td');
tr.appendChild(td3);
var td4 = document.createElement('td');
tr.appendChild(td4);
var td5 = document.createElement('td');
tr.appendChild(td5);
}
table.tBodies[0].appendChild(tr);
} function ccb(){
console.log(11);
}
</script>
</body>
</html>
解决方案 »
- Easyui datagrid 绑定键盘上下键操作选中行的问题
- Extjs4 model中的fields,以及chart疑惑求解答~
- 如何不使用FrameSet ,而达到使用FrameSet 的效果, 主要是分栏和拖过鼠标改变各栏的大小?
- 可以运行的代码放到另一个函数里就不能运行了。
- ajax在WINDOW2003下的末指定错误
- 如何用JS实现报表功能,就是横向统计,纵向统计。
- 我认为是高难度问题!
- 如何使用javascript来修改系统时间?下面的代码有何问题吗/
- 急需帮助!动态传递form中table参数的好办法?
- getElementByName该如何使用
- js如何批量修改gridview中一列控件的值?在线求解
- jquery能否改变页面上的变量的值
在线demo<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>
</head>
<body>
<input id="btn" type="submit" value="插入"/>
<form action="">
<table id="glhdtable" width="500" border="1">
<tr>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
</tr>
</table>
</form>
<script type="text/javascript">
var btn = document.getElementById('btn')
var table = document.getElementById('glhdtable');
var hdlength = 3;
btn.onclick = function(){
for(var i = 0; i < hdlength; i++){
var tr = document.createElement('tr')
var td1 = document.createElement('td');
td1.innerHTML = '<input type="checkbox" value="1" onclick="ccb()" id="glhdcheckbox2" name="glhdcheckbox2">';
tr.appendChild(td1); var td2 = document.createElement('td');
tr.appendChild(td2);
var td3 = document.createElement('td');
tr.appendChild(td3);
var td4 = document.createElement('td');
tr.appendChild(td4);
var td5 = document.createElement('td');
tr.appendChild(td5);
table.tBodies[0].appendChild(tr);
}
} function ccb(){
console.log(11);
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>test</title>
<style type="text/css">
</style>
</head>
<body>
<input id="btn" type="submit" value="插入"/>
<form action="">
<table id="glhdtable" width="500" border="1">
<tr>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
<th>111</th>
</tr>
</table>
</form>
<script type="text/javascript">
var btn = document.getElementById('btn')
var table = document.getElementById('glhdtable');
var hdlength = 3;
btn.onclick = function(){
for(var i = 0; i < hdlength; i++){
var tr = document.createElement('tr')
var form = document.createElement('form');
form.action = '';
form.url = '';
tr.appendChild(form);
var td1 = document.createElement('td');
td1.innerHTML = '<input type="checkbox" value="1" onclick="ccb()" id="glhdcheckbox2" name="glhdcheckbox2">';
form.appendChild(td1); var td2 = document.createElement('td');
td2.innerHTML = '11'
form.appendChild(td2);
var td3 = document.createElement('td');
form.appendChild(td3);
var td4 = document.createElement('td');
form.appendChild(td4);
var td5 = document.createElement('td');
form.appendChild(td5);
tr.appendChild(form); table.tBodies[0].appendChild(tr);
}
} function ccb(){
console.log(11);
}
</script>
</body>
</html>
你这样子插入表单的话就会出现我那个问题。。
现在给你的建议就是:
不要把form插入到td里边去,插入就会出现那个问题。
非要用数据提交,建议使用ajax方式。