使用js在table中添加一行

 //添加拦截点

 $("#J_add").on("click",function(){

  var table =document.getElementById("J_tab");

  var num = table.rows.length;

  var A_tr = '<tr id="intereceptTr'+num+'"><td width="50" class="tab_cen border_down">'+num+'</td><td class="tab_cen border_down"><div class="form-group"><input id="intereceptMethod'+num+'" name="intereceptMethod'+num+'" type="text" class="inter_input"/></div></td><td width="200" class="tab_cen border_down"><a href="#" class="tablelink" οnclick="deltr(\'intereceptTr'+num+'\')">删除</a></td></tr>';

  $("#J_tab").append(A_tr);

//验证

  $("#intereceptMethod"+num).rules("add", {    

            required: true,    

            maxlength: 200,    

            messages: {    

                required: "请设置拦截点"

            }    

        });

 });

  <div class="intergral_tit clearfix"><p>拦截点设置</p><span id="J_add"><a href="#">添加拦截点</a></span></div>

   <div class="intergral_tab">

   <table width="100%" border="0" cellspacing="0" cellpadding="0" class="tablelist" id="J_tab">

      <tbody>

       <tr>

         <th width="50" class="tab_cen">序号</th>

         <th class="tab_cen">拦截点</th>

         <th width="200" class="tab_cen">操作</th>

       </tr>

      </tbody>

   </table>

//****************************************************************************************************************************

//另外一种写法

var row_num = ${empty templateInfo.templateParamInfos?1:fn:length(templateInfo.templateParamInfos)};

function addTemplateParamRow(){

 var $paramCode = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="paramCode'+row_num+'" validate="{required:true,maxlength:20,codeValid:true}"></div></td>');

 var $paramName = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="paramName'+row_num+'" validate="{required:true,maxlength:20}"></div></td>');

 var $defaultValue = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="defaultValue'+row_num+'" validate="{maxlength:20}"></div></td>')

 var $mark = $('<td class="tab_cen border_down" width="20%"><div class="form-group"><input class="Cfb_wbk" type="text" name="mark'+row_num+'" validate="{maxlength:50}"></div></td>')

 var $delRow = $('<td class="tab_cen border_down"><a href="javascript:void(0)" class="tablelink" οnclick="deleteRow(\'row_'+row_num+'\')">删除</a></td>')

 var $tr=$('<tr id="row_'+row_num+'"></tr>');

 $tr.append($paramCode);

 $tr.append($paramName);

 $tr.append($defaultValue);

 $tr.append($mark);

 $tr.append($delRow);

 

 $("#param_tbody").append($tr);

 

 row_num++;

}

<div class="tab_height">

 <table class="tablelist nobar">

  <tbody id="param_tbody">

   <c:forEach items="${templateInfo.templateParamInfos}" var="ti" varStatus="vs">

    <tr id="row_${vs.index }">

     <td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="paramCode${vs.index }" value="${ti.paramCode }" validate="{required:true,maxlength:20,codeValid:true}"></div></td>

     <td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="paramName${vs.index }" value="${ti.paramName }" validate="{required:true,maxlength:20}"></div></td>

     <td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="defaultValue${vs.index }" value="${ti.defaultValue }" validate="{maxlength:20}"></div></td>

     <td class="tab_cen" width="20%"><div class="form-group"><input class="fb_wbk" type="text" name="mark${vs.index }" value="${ti.mark }" validate="{maxlength:50}"></div></td>

     <td class="tab_cen"><a href="javascript:void(0)" class="tablelink" οnclick="deleteRow('row_${vs.index }')">删除</a></td>

    </tr>

   </c:forEach>

  </tbody>

 </table>

</div>