JQuery實現(xiàn)動態(tài)表格點擊按鈕表格增加一行

更新時間：2014年08月24日 09:24:18 投稿：whsnow

動態(tài)表格,功能為點擊添加按鈕，表格增加一行并給其name屬性賦予的值，點擊刪除，自動刪除這一行，具體實現(xiàn)如下

功能實現(xiàn)：點擊添加按鈕，表格增加一行并給其name屬性賦予的值，方便獲取

點擊刪除，自動刪除這一行

JQuery中定義一個count變量

var count = 1;
function add() {
var tbl = document.all.ci;
var rows = tbl.rows.length;
var tr = tbl.insertRow(rows);

var e_id = tr.insertCell(0);
e_id.innerHTML = '<input type="text" name="e_id' + count + '" size="7" />';

var class_id = tr.insertCell(1);
class_id.innerHTML = '';

var memo = tr.insertCell(2);
memo.innerHTML = '<input type="text" name="memo' + count + '" size="14" />';

var del = tr.insertCell(3);
del.innerHTML = '<input type="button" onclick="del(this)" value="刪除" />';
count++;
}

function del(btn) {
var tr = btn.parentElement.parentElement;
var tbl = tr.parentElement;
if (tr.rowIndex >= 1) {
tbl.deleteRow(tr.rowIndex);
} else {

}
};

您可能感興趣的文章:

jquery操作checked屬性以及disabled屬性的多種方法
這篇文章主要介紹了jquery控制checked屬性以及disabled屬性的多種方法,下面只提到checked,其實disabled在jquery里的用法和checked是一模一樣的,需要的朋友可以參考下
2014-06-06
JQuery EasyUI 結合ztrIee的后臺頁面開發(fā)實例
下面小編就為大家?guī)硪黄狫Query EasyUI 結合ztrIee的后臺頁面開發(fā)實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-09-09
jQuery代碼性能優(yōu)化的10種方法
之前，我們減少字節(jié)數(shù)和請求次數(shù)以及加載順序以使頁面加載的更快。如今，我們越來越多的注意到另一個影響網(wǎng)站性能的部分--CPU利用率。使用 jQuery和其他JavaScript框架，使節(jié)點選擇和DOM操作變得越來越容易，如果使用不當，有可能影響整個網(wǎng)頁的響應速度。
2016-06-06
Jquery 常用方法經(jīng)典總結
Jquery 常用方法，學習jquery的朋友可以參考下。
2010-01-01
jquery表單驗證插件validation使用方法詳解
這篇文章主要為大家詳細介紹了jquery表單驗證插件validation使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-01-01
整理的40個有用的jQuery技術和教程
jQuery確實是一項偉大的技術，通過jQuery的插件，我們可以方便的創(chuàng)建具有更好用戶界面的網(wǎng)站。在本文中，將和大家分享40個對你創(chuàng)建更好用戶界面的jQuery技術和教程。
2011-01-01
jQuery 學習幾種常用方法
jQuery中為我們提供了很多有用的方法和屬性，自己總結的一些常用的函數(shù)，方法。個人認為在開發(fā)中會比較常用的，僅供大家學習和參考。
2009-06-06
jQuery dateRangePicker插件使用方法詳解
這篇文章主要為大家詳細介紹了jQuery dateRangePicker插件的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-07-07
jQuery在頁面加載時動態(tài)修改圖片尺寸的方法
這篇文章主要介紹了jQuery在頁面加載時動態(tài)修改圖片尺寸的方法,實例分析了jQuery操作圖片的技巧,非常具有實用價值,需要的朋友可以參考下
2015-03-03
jQuery學習筆記之jQuery中的$
這篇文章主要介紹了jQuery學習筆記之jQuery中的$的相關資料,需要的朋友可以參考下
2015-01-01