<table id="testTbl" border=1>
<tr id="tr1">
<td width=6%><input type=checkbox id="box1"></td>
<td id="b">第一行</td>
</tr>
<tr id="tr2">
<td width=6%><input type=checkbox id="box2"></td>
<td id="b">第二行</td>
</tr>
<tr bgcolor=#0000FF>
<td width=6%><input type=checkbox id="box3"></td>
<td>第三行</td>
</tr>
</table>
动态添加表行的javascript函数如下:
function addRow(){
//添加一行
var newTr = testTbl.insertRow()
//添加两列
var newTd0 = newTr.insertCell()
var newTd1 = newTr.insertCell()
//设置列内容和属性
newTd0.innerHTML = '<input type=checkbox id="box4">'
newTd2.innerText= '新加行'
}
①。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>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)