目前很多列表的編輯功能，都是點(diǎn)擊單行編輯按鈕，然后進(jìn)行單條的跳轉(zhuǎn)或者彈窗編輯，數(shù)量少還可以，數(shù)據(jù)比較大，改動(dòng)比較多的話，這樣效率就是災(zāi)難性的。如過(guò)能雙擊某個(gè)單元格即可進(jìn)行編輯，這樣帶來(lái)的效率提升是非常大的，實(shí)現(xiàn)如下：
$('#tb_list').on('dblclick', 'td', function () {
$('#tb_list').on('dblclick', 'td', function () {
var oldVal = $(this).text();
var input = "";
$(this).text('');
$(this).append(input);
$('#tmpId').focus();
$('#tmpId').blur(function(){
if($(this).val() != ''){
oldVal = $(this).val();
}
//closest：是從當(dāng)前元素開(kāi)始，沿Dom樹(shù)向上遍歷直到找到已應(yīng)用選擇器的一個(gè)匹配為止。
$(this).closest('td').text(oldVal);
});
});
| 姓名 | 語(yǔ)文 | 數(shù)學(xué) | 英語(yǔ) | 合計(jì) |
|---|
以上就是“雙擊table的td進(jìn)行編輯的案例分享”的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注木子天禾科技其它相關(guān)文章！
