jQuery动态创建表单示例
最近做了个动态创建表单，添加记录，想到jQuery，就用上了，现共享如下。
1.js方法
function addSetting(){
var mytbody=jQuery('#evaluatetable').find('tbody');
//var firstTr = jQuery('#evaluatetable').find('tbody>tr:first');
var firstTr = mytbody.find('tr:first');
var row=jQuery('<TR></TR>');
row.insertBefore(firstTr);
var td=jQuery('<TD></TD>')
td.append('<input name="evachk" type="checkbox" value="neweva"/>');
var td2=jQuery('<TD></TD>')
td2.append('<input name="guidelineName" type="text" value=""/>');
var td3=jQuery('<TD></TD>')
td3.append('<input name="purvalue" type="text" value=""/>');
var td4=jQuery('<TD></TD>')
td4.append('<a href="#" onclick="saveSetting();"><span><span>保存</span></span></a>');
row.append(td);
row.append(td2);
row.append(td3);
row.append(td4);
if(firstTr.attr('id')=='noRecord'){
firstTr.hide();
}
}
function reduceSetting(){
var checks= jQuery('input[name=evachk]:checked');
if(checks.length==0){
alert('请选定要删除的项');
return false;
}
checks.each(function(){
if(this.value=='neweva'){
var trow= this.parentElement.parentElement;
jQuery(trow).remove();
}
});
if(jQuery('#evaluatetable').find('tbody>tr').length==1){
jQuery('#noRecord').show();
}
}
</script>
2.页面元素
没有指标设置</td>
</tr>
</logic:empty>
<logic:notEmpty name="list" >
<logic:iterate id="eva" name="list" >
<tr onmouseover="this.className='highlight'" onmouseout="this.className='odd'">
<td><input name="evachk" type="checkbox" value="${eva.guidelineId}" /></td>
<td>${eva.guidelineName}</td>
<td>${eva.purValue}</td>
<td><a href="#" onclick="editSetting('${eva.guidelineId}');"><span><span>编辑</span></span></a></td>
</tr>
</logic:iterate>
</logic:notEmpty>
</tbody>
</table>
