1、在页面div中事先创建一个空白表格，可以根据需求而定。
2、表格创建好后，我们就可以写动态生成表格的关键代码了。我们写一个js方法供触发使用。
3、在<tb>标签中我们添加了<input>标签，主要是用来提供用户输入参数， 而全局变量num，主要是用来区分每一个添加的参数的id的唯一性而存在的。
4、获得表格中的数据。
5、拿到表格中的数据后，我们根据它值的形式把它转换成json格式的数据。
①。html有点错，radio的name相同，id不能相同，②。如果value的值分别写为0和1，要写进表格的值为男和女的话，那么js中还要在判断下
③。如果要在当勾选了复选框后，“删除选中的行”按钮启用，没打勾就一直禁用的话，那js中还得加点内容。
利用楼上的那位改的：
<script type="text/javascript">
function buttonDisplay(){
document.getElementById('del').disabled=false
}
function AddAction()
{
var _table=document.getElementById("studentList")
var _tr=_table.insertRow(-1)
var _td=new Array(5)
for(var i=0i<_td.lengthi++)
{
_td[i]=_tr.insertCell(-1)
}
_td[0].innerHTML="<input type='checkbox' name='ck' value='' onclick='buttonDisplay()'/>"
_td[1].innerHTML=_tr.rowIndex
_td[2].innerHTML=document.getElementById("studentName").value
_td[3].innerHTML=document.getElementById("studentAge").value
var gender = document.getElementsByName('studentSex')
var selectedGenderValue = ''
for(var i = 0i<gender.lengthi++){
if(gender[i].checked){
if(gender[i].value == 1) {
selectedGenderValue = '男'
}else if(gender[i].value == 0){
selectedGenderValue = '女'
}
}
}
_td[4].innerHTML = selectedGenderValue
}
function TableDel()
{
var _table=document.getElementById("studentList")
var cks=document.getElementsByName("ck")
for(var i=cks.length-1i>=0i--)
{
if(cks[i].checked){
_table.deleteRow(cks[i].parentNode.parentNode.rowIndex)
document.getElementById('del').disabled="true"
}
}
}
</script>
标准的表格 *** 作，并没有 innerCell() 的，innerRow 是添加一行，innerCell 只在部分浏览器中可以实现，不过现在大部分都支持 innerCell()
<!DOCTYPE HTML><html>
<body>
<table>
<tbody id="tab">
</tbody>
</table>
</body>
</html> <script type="text/javascript">
window.onload = function() {
// 为 id = tab 的控件添加一行 <tr></tr>
var row = tab.insertRow(-1)
// 创建 th 列
var cell_0 = document.createElement("th")
// 设置他的 scope 属性为 row，设置他的 innerHTML 为 title
cell_0.setAttribute("scope", "row")
cell_0.innerHTML = "title"
var cell_1 = document.createElement("th")
cell_1.setAttribute("scope", "row")
cell_1.innerHTML = "name"
// 把创建好的 cell_0 和 cell_1 添加到 行中
row.appendChild(cell_0)
row.appendChild(cell_1)
// 打印出当前 id=tab 的内容，可以看到， <tr><th scope="row">title</th><th scope="row">name</th></tr>
alert(tab.innerHTML)
}
</script>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）