jquery 动态增加行
$("#newOrd").click(function(){
var $table= $("#tabOrders tr");
var len=$table.length;
var listId=len-2;
$("#tabOrders").append("<tr height='25' id='"+(len+1)+"' class='tr_3' > <td class='OrderCellBt' width='40' align='center' >"+(len-1)+"</td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].ordSeqName' class='NoneBorder' style='WIDTH: 100px; HEIGHT: 18px; TEXT-ALIGN: left' /></td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].catName' readonly class='NoneBorder' style='WIDTH: 110px; HEIGHT: 18px; TEXT-ALIGN: left' /><input class='helpbutton' align='right' onclick='showCatNo("+(len+1)+");' type='button'><input type='hidden' name='ordersDtlList["+listId+"].catNo' /></td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].orddUnit' class='NoneBorder' style='WIDTH: 42px; HEIGHT: 18px; TEXT-ALIGN: center' /></td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].orddQty' class='NoneBorder' onblur='getPrice(this,"+(len+1)+")' style='WIDTH: 45px; HEIGHT: 18px; TEXT-ALIGN: right' /></td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].orddPrc' class='NoneBorder' onblur='getPrice(this,"+(len+1)+")' style='WIDTH: 45px; HEIGHT: 18px; TEXT-ALIGN: right' /></td>" +
"<td class='OrderCellItem' align='center' colSpan='2'><input name='ordersDtlList["+listId+"].orddAmt' readonly onblur='getPrice(this,"+(len+1)+")' class='NoneBorder' style='WIDTH: 45px; HEIGHT: 18px; TEXT-ALIGN: right' /></td>" +
"<td class='OrderCellItem' align='center'><input name='ordersDtlList["+listId+"].orddRemark' class='NoneBorder' style='WIDTH: 40px; HEIGHT: 18px; TEXT-ALIGN: left' /><input type='button' style='WIDTH: 20px; BACKGROUND-COLOR: #e0e3ea' onclick='showRemark("+(len+1)+")' value='...' ></td>" +
"<td class='OrderCellItem' align='center' ><input name='ordersDtlList["+listId+"].orddFund1' class='NoneBorder' style='WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left' /></td>" +
"<td class='OrderCellItem' align='center' ><input name='ordersDtlList["+listId+"].orddFund3' class='NoneBorder' style='WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left' /></td>" +
"<td class='OrderCellItem' align='center' ><input name='ordersDtlList["+listId+"].orddFund5' class='NoneBorder' style='WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left' /></td>" +
"<td class='OrderCellItem' align='center'><a href='javascript:void(0)' onclick='deltr("+(len+1)+")'><font color='blue'>删除</font></a</tr>");
});
function deltr(index){
var $table=$("#tabOrders tr");
var len= $table.length;
index=parseInt(index);
if(index>len){
return;
}else {
var newAmt=document.getElementById("newAmt");
var newQty=document.getElementById("newQty");
var $tr=$("tr[id='"+i+"']");
if($tr.find("td").eq(4).find("input").eq(0).val()!=""){
newQty.value= Subtr(newQty.value,$tr.find("td").eq(4).find("input").eq(0).val());
}
if($tr.find("td").eq(6).find("input").eq(0).val()!=""){
newAmt.value= Subtr(newAmt.value,$tr.find("td").eq(6).find("input").eq(0).val());
}
$("tr[id='"+(index)+"']").remove();
for( var i= index+1;i<=len;i++){
var listId=i-4;
var $tr=$("tr[id='"+i+"']");
$tr.find("td").eq(0).html(i-3);
$tr.find("td").eq(1).find("input").eq(0).attr("name","ordersDtlList["+listId+"].ordSeqName") ;
$tr.find("td").eq(2).find("input").eq(2).attr("name","ordersDtlList["+listId+"].catNo") ;
$tr.find("td").eq(2).find("input").eq(0).attr("name","ordersDtlList["+listId+"].catName") ;
$tr.find("td").eq(2).find("input").eq(1).attr("onclick","") ;
$tr.find("td").eq(2).find("input").eq(1).unbind("click") ;
$tr.find("td").eq(2).find("input").eq(1).bind("click",function (event){
var target= event.target;
var index=target.parentElement.parentElement.id;
showCatNo(index)});
$tr.find("td").eq(3).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddUnit") ;
$tr.find("td").eq(4).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddQty") ;
$tr.find("td").eq(4).find("input").eq(0).attr("onblur","");
$tr.find("td").eq(4).find("input").eq(0).unbind("blur") ;
$tr.find("td").eq(4).find("input").eq(0).bind("blur",function (event){
var target= event.target;
var index=target.parentElement.parentElement.id;
getPrice(target,index)});
$tr.find("td").eq(5).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddPrc") ;
$tr.find("td").eq(5).find("input").eq(0).attr("onblur","");
$tr.find("td").eq(5).find("input").eq(0).unbind("blur") ;
$tr.find("td").eq(5).find("input").eq(0).bind("blur",function (event){
var target= event.target;
var index=target.parentElement.parentElement.id;
getPrice(target,index)});
$tr.find("td").eq(6).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddAmt") ;
$tr.find("td").eq(6).find("input").eq(0).attr("onblur","");
$tr.find("td").eq(6).find("input").eq(0).unbind("blur") ;
$tr.find("td").eq(6).find("input").eq(0).bind("blur",function (event){
var target= event.target;
var index=target.parentElement.parentElement.id;
getPrice(target,index)});
$tr.find("td").eq(7).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddRemark") ;
$tr.find("td").eq(7).find("input").eq(1).attr("onclick","") ;
$tr.find("td").eq(7).find("input").eq(1).unbind("click") ;
$tr.find("td").eq(7).find("input").eq(1).bind("click",function (event){
var target= event.target;
var index=target.parentElement.parentElement.id;
showRemark(index)});
$tr.find("td").eq(8).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddFund1") ;
$tr.find("td").eq(9).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddFund1") ;
$tr.find("td").eq(10).find("input").eq(0).attr("name","ordersDtlList["+listId+"].orddFund1") ;
$tr.find("td").eq(11).html("<a href='javascript:void(0)' onclick='deltr("+(i-1)+")'><font color='blue'>删除</font></a>") ;
$tr.attr("id",(i-1));
}
}
}
<td align="left">
<table id="tabOrders" width="100%" ><tr height="25">
<td align="center" width="40" rowSpan="2">
</td>
<td align="center" width="120" rowSpan="2"> </td>
<td align="center" width="150" rowSpan="2"> </td>
<td align="center" width="48" rowSpan="2"> </td>
<td align="center" width="46" rowSpan="2"> </td>
<td align="center" width="170" colSpan="2"> </td>
<td align="center" width="105" colSpan="2" rowSpan="2"> </td>
<td align="center" colSpan="3" > </td>
<td align="center" width="100" rowSpan="2">
编辑
</td>
</tr>
<tr height="25">
<td align="center" width="80"> </td>
<td align="center" width="95"> </td>
<td align="center" width="60"> </td>
<td align="center" width="60"> </td>
<td align="center" width="70"> </td>
</tr><s:iterator value="ordersDtlList" status="sta" var="x">
<tr height="25" id='${sta.count+2}' align="center" align="center"><s:textfield name="ordersDtlList[%{#sta.index}].ordSeqName" onblur="validatMaxLength(this,50)" cssalign="center">
<s:textfield name="ordersDtlList[%{#sta.index}].catName" readonly ="true" cssonclick="showCatNo('${sta.count+2}');" type="button" ><s:hidden name="ordersDtlList[%{#sta.index}].catNo" />
</td>
<td align="center"><s:textfield name="ordersDtlList[%{#sta.index}].orddUnit" onblur="validatMaxLength(this,6)" css/>
</td>
<td align="center"><s:textfield name="ordersDtlList[%{#sta.index}].orddQty" value="%{orddQty==0?'':orddQty}" onblur="getPrice(this,'%{#sta.count+2}')" css/>
</td>
<td align="center">
<s:textfield name="ordersDtlList[%{#sta.index}].orddPrc" value="%{orddPrc==0?'':orddPrc}" cssalign="center" ><s:textfield name="ordersDtlList[%{#sta.index}].orddAmt" readonly="true" value="%{orddAmt==0?'':orddAmt}" onblur="getPrice(this,'%{#sta.count+2}')" csscssStyle="WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: right" />
</td>
<td align="center" colSpan="2"><s:textfield name="ordersDtlList[%{#sta.index}].orddRemark" cssClass='NoneBorder' cssStyle="WIDTH: 40px; HEIGHT: 18px; TEXT-ALIGN: left"/><input type='button' style='WIDTH: 20px; BACKGROUND-COLOR: #e0e3ea' onclick="showRemark('${sta.count+2}')" value='...' >
</td>
<td align="center" ><s:textfield name="ordersDtlList[%{#sta.index}].orddFund1" cssClass='NoneBorder' value="%{orddFund1==0?'':orddFund1}" cssStyle="WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left"/>
</td>
<td align="center" ><s:textfield name="ordersDtlList[%{#sta.index}].orddFund3" cssClass='NoneBorder' value="%{orddFund3==0?'':orddFund3}" cssStyle="WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left"/>
</td>
<td align="center" ><s:textfield name="ordersDtlList[%{#sta.index}].orddFund5" cssClass='NoneBorder' value="%{orddFund5==0?'':orddFund5}" cssStyle="WIDTH: 60px; HEIGHT: 18px; TEXT-ALIGN: left"/>
</td>
<td class='OrderCellItem' align='center'> <a href='javascript:void(0)' onclick='deltr("${sta.count+2}")'><font color="blue">删除</font></a>
</td>
</tr>
</s:iterator>
</table>
