龙空技术网

jquery html表格添加行

天目神泉 1521

前言:

此时朋友们对“css表格写法”大体比较珍视,大家都需要知道一些“css表格写法”的相关内容。那么小编在网上收集了一些关于“css表格写法””的相关内容,希望姐妹们能喜欢,我们快快来了解一下吧!

自己美化吧

<section>

<table id="addrow" border=1>

<tr>

<td></td>

<td>序号</td>

<td></td>

</tr>

<tr>

<td></td>

<td>1</td>

<td></td>

</tr>

</table>

<button onclick='AddRow();'>添加行</button>

</section>

<script>

//添加行

function AddRow() {

// 被点击的目标标签tagName 如INPUT DIV

var clicktagname = $(event.target).get(0).tagName;

//获取点击对象

var clickedNode = event.target;

var $table = $(clickedNode).closest("section").find("table:first");

var tableId = $table.attr("id");

//var $table=$("#"+tableId);

var numRows = $table.find("tr").length; //行数

if(numRows > 20) { //数据行最多10行 共11行

mscAlert("别再加了!");

return false;

} else {

numRows = $table.find("tr").length;

$("#" + tableId + " tr:last").clone(false).insertBefore("#" + tableId + " tr:eq(1)");

}

for(var i = 1; i < numRows + 1; i++) { //第二列序号

$('#' + tableId + ' tr:eq(' + i + ') td:eq(1)').text(i);

}

}

</script>

标签: #css表格写法