table的动态插入和删除

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>无标题文档</title>

function addRow(src) {

// alert(src);

var newrow = src.insertRow(src.rows.length - 1);

newrow.height = 20;

var i = 4;

while (i--) {

var newcell = newrow.insertCell();

switch (i) {

case 0 :

newcell.innerHTML = '<input type="button" onClick="javascript:delRow(this.parentElement.parentElement)" value="删除此行">';

break;

default :

newcell.innerHTML = div1.innerHTML;

break;

}

function delRow(src) {

var tab = src.parentElement;

var i = tab.rows.length;

while (i--) {

if (src == tab.rows[i]) {

alert("就是这行----" + i);

tab.deleteRow(i);

}

</script>

</head>

<body>

<table id="tb" width="100%" border="1" align="center" cellpadding="1"

cellspacing="1" style="border-collapse:collapse"

bordercolor="#111111">

<tr>

奶类

</th>

数量

</th>

总重

</th>

单价

</th>

</tr>

<td>

</td>

<td>

</td>

<td>

</td>

<td>

</td>

</tr>

</table>

<input id="txt" type="text"

style="width:97%; background-color:#FFFFEF">

</div>

</body>

</html>

posted on 2009-02-28 10:16 飞翔天使阅读(253) 评论(0) 编辑收藏所属分类: javascript

常用链接

留言簿(1)

随笔分类(146)

随笔档案(147)

文章分类(28)

文章档案(28)

喜欢的Blog

搜索

最新评论

阅读排行榜

评论排行榜