如何用JS实现动态加行~

如何用JS实现动态加行~,第1张

表格部分代码如下:

<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= '新加行'

}

function appendTable(jsonObj) { var tabL = gel("tbList")var taRow = tabL.rows//tabL 对象的行集合 //这里应该是判断有几行,取 length if (taRow.length >1) { //原先是不满足条件,而不是删除不起作用 tabL.deleteRow(2)} f

HTML code<script language="javascript" type="text/javascript">

function add(){

var tb = document.getElementById("tb")

var tr = tb.insertRow(0)

tr.style.cssText = tb.rows[1].style.cssText

var td = tr.insertCell()

td.innerHTML = "00000"

}

</script>

<input type="button" onclick="add()" value="add">

<table id="tb">

<tr style="background:#CCC"><td>xxx</td></tr>

</table>

------解决方案--------------------

JScript code/*

insertRow()这样是IE独有的.

标准用法是:

insertRow(-1): index为-1的时候就是默认插在最后一行.

insertRow( 0): index为0的时候就是插在第一行

至于样式一样 应该在样式表里统一设置.


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11413374.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-15
下一篇 2023-05-15

发表评论

登录后才能评论

评论列表(0条)

保存