jquery動態(tài)增加刪除表格行的小例子
<script src="jquery/jquery-1.3.1.js"></script>
<style type="text/css">
body{background:#FFFFFF;}
</style>
</head>
<body>
<script>
$(function(){
var show_count = 20; //要顯示的條數(shù)
var count = $("input:text").val(); //遞增的開始值,這里是你的ID
var fin_count = parseInt(count) + (show_count-1); //結(jié)束遞增的條件
$("#btn_addtr").click(function(){
if(count < fin_count) //點擊時候,如果當(dāng)前的數(shù)字小于遞增結(jié)束的條件
{
$("tr:eq(1)").clone().appendTo("table"); //在表格后面添加一行
$("tr:last td input:first").val(++count); //改變添加的行的ID值。
}
});
});
function deltr(){
var length=$("tr").length;
if(length<=2){
alert("至少保留一行");
}else{
$("tr:last").remove();
}
}
</script>
<input type="button" id="btn_addtr" value="增行">
<table id="dynamicTable" width="700" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="30" align="center" bgcolor="#CCCCCC">ID</td>
<td align="center" bgcolor="#CCCCCC">Username</td>
<td align="center" bgcolor="#CCCCCC">Usertype</td>
<td align="center" bgcolor="#CCCCCC">Other</td>
<td></td>
</tr>
<tr>
<td height="30" align="center"><input type="text" size="2" value="1" /></td>
<td align="center"><input type="text" name="username" /></td>
<td align="center">
<select name="type">
<option value="1">Administrator</option>
<option value="2">Guest</option>
</select>
</td>
<td align="center"><input type="text" name="username2" /></td>
<td><input type="button" id="btn_deltr" onclick="deltr()" value="刪行"></td>
</tr>
</table>
</body>
- jQuery動態(tài)操作表單示例【基于table表格】
- jQuery+Datatables實現(xiàn)表格批量刪除功能【推薦】
- 基于jquery的實現(xiàn)簡單的表格中增加或刪除下一行
- jQuery實現(xiàn)表格行和列的動態(tài)添加與刪除方法【測試可用】
- jQuery對table表格進行增刪改查
- 基于jQuery的動態(tài)增刪改查表格信息,可左鍵/右鍵提示(原創(chuàng)自Zjmainstay)
- 基于jQuery實現(xiàn)表格的查看修改刪除
- JQuery動態(tài)添加和刪除表格行的方法
- 原生JS和JQuery動態(tài)添加、刪除表格行的方法
- jquery動態(tài)增加刪減表格行特效
- jQuery實現(xiàn)表格的增、刪、改操作示例
相關(guān)文章
Jquery Ajax學(xué)習(xí)實例3 向WebService發(fā)出請求,調(diào)用方法返回數(shù)據(jù)
Jquery Ajax學(xué)習(xí)實例3 向WebService發(fā)出請求,調(diào)用方法返回數(shù)據(jù)2010-03-03基于jQuery的message插件實現(xiàn)右下角彈出消息框
有時在頁面加載的時候,需要在頁面的右下角彈出一個小的提示框,顯示一些提示信息給用戶,通過使用jQuery的message插件,可以很方便的實現(xiàn)這個效果,在使用之前先介紹一下message插件中的方法的使用。2011-01-01jQuery Ajax方法調(diào)用 Asp.Net WebService 的詳細實例代碼
我在這里將jQuery Ajax 調(diào)用Aspx.Net WebService 的幾個常用的方法做了一個整理,提供給正在找這方面內(nèi)容的博友,希望能給學(xué)習(xí)jQuery的朋友一點幫助,可以直接復(fù)制代碼運行。2011-04-04jquery 動態(tài)創(chuàng)建元素的方式介紹及應(yīng)用
動態(tài)創(chuàng)建元素可以通過兩種方式1、Dom HTml2、JQuery函數(shù)創(chuàng)建3、頁面加載的時候最好在頁面加載完后執(zhí)行創(chuàng)建,感興趣的朋友可以了解下2013-04-04