最近做一个投票管理的模块,需要添加问题选项,为了方便,就简单地实现了表格行的添加、删除。
注:需引入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--;
}
//添加行
function addRow(){
rowCount++;
var newRow='
$('#optionContainer').append(newRow);
}
//删除行
function delRow(rowIndex){
$("#option"+rowIndex).remove();
rowCount--;
}
需要注意的是,表单的
JS中要定义一个行数变量,因为我的表单中默认了4行(第一行,即id='option0'这行可以不用管),所以JS中定义的rowCount默认为4.
OK,完事。就如此的简单。
另外,如果需要在指定位置增加行,需要这么写
代码如下:
$("#tab tr").eq(-2).after("关键词名称: * ");
-2就是在倒数第二个tr后面增加行。
tab是表格的id
希望本文所述对大家的jQuery程序设计有所帮助。