色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

jquery表格編輯添加刪除行

錢琪琛1年前6瀏覽0評論

jQuery是一種非常流行的JavaScript庫,在網(wǎng)頁開發(fā)中經(jīng)常使用。在很多網(wǎng)頁中,表格是不可缺少的一部分。但是,如果需要在表格中進(jìn)行一些編輯、添加、刪除操作的時(shí)候,就需要使用一些jQuery的技巧。

jQuery可以通過選中表格中的行或者單元格,對它們進(jìn)行操作。在進(jìn)行編輯、添加、刪除等操作的時(shí)候,我們需要先選中目標(biāo)行或者單元格,然后對它們進(jìn)行相應(yīng)的操作。

//選中表格行并進(jìn)行編輯操作
$("table tr").click(function(){
var tr=$(this);
//將表格中的文本內(nèi)容轉(zhuǎn)換成可編輯的文本框
tr.find("td").each(function(i,td){
var $td=$(td);
var txt=$td.text();
//去掉文本框中的空格
txt=$.trim(txt);
//構(gòu)建文本框HTML代碼
$td.html("<input type='text' name='"+i+"' value='"+txt+"'/>");
});
});
//向表格添加新行
$("#add").click(function(){
var html="<tr>";
html+="<td>新增數(shù)據(jù)</td>";
html+="<td></td>";
html+="<td></td>";
html+="</tr>";
//將新行添加到表格最后一行的后面
$("table tr:last").after(html);
});
//刪除表格中的行
$("#delete").click(function(){
$("table input[type='checkbox']:checked").each(function(i,chk){
var tr=$(chk).closest("tr");
tr.remove();
});
});

以上代碼實(shí)現(xiàn)了對表格中的行進(jìn)行編輯、添加、刪除操作。通過點(diǎn)擊表格中的行,可以將行中的文本內(nèi)容轉(zhuǎn)換成可編輯的文本框;通過點(diǎn)擊添加按鈕,可以向表格中添加一行數(shù)據(jù);通過點(diǎn)擊刪除按鈕,可以刪除表格中選中的行。

總之,jQuery提供了很多方便的方法和函數(shù),使得操作表格變得非常簡單。在網(wǎng)頁開發(fā)中,我們可以根據(jù)實(shí)際需要靈活運(yùn)用jQuery,達(dá)到更好的效果。