本文实例讲述了jquery实现增加删除行的方法。分享给大家供大家参考。具体分析如下:
最近做一个投票管理的模块,需要添加问题选项,为了方便,就简单地实现了表格行的添加、删除。
注:需引入jquery.js
先上效果图:(form中默认有4行)
表单代码:
复制代码 代码如下:
所属问题
(单选)
(复选):
${question}
选项1:
选项2:
选项3:
选项4:
添加一行
js代码:
复制代码 代码如下:
var rowcount=4; //行数默认4行
//添加行
function addrow(){
rowcount++;
var newrow='选项'+rowcount+': 删除
';
$('#optioncontainer').append(newrow);
}
//删除行
function delrow(rowindex){
$(#option+rowindex).remove();
rowcount--;
}
需要注意的是,表单的
中需要定义id,如果默认有行的,就如代码所示有规律地定义好id,这样可以方便添加一行的时候定义新行id。js中要定义一个行数变量,因为我的表单中默认了4行(第一行,即id='option0'这行可以不用管),所以js中定义的rowcount默认为4.
ok,完事。就如此的简单。
另外,如果需要在指定位置增加行,需要这么写
复制代码 代码如下:
$(#tab tr).eq(-2).after(关键词名称: *
);
-2就是在倒数第二个tr后面增加行。
tab是表格的id
希望本文所述对大家的jquery程序设计有所帮助。