请教大神,我现在遇到一个jquery的难题,动态添加一行input,序号递增,为何序号从第二行开始,总是覆盖这个位置的序号项,之前的一行,却不会被保留下来,如何做才能保留第一行添加的序号?
代码如下:
$("#addOneMoreLine").click(function(){
debugger;
var j=$("#countnumber").text();
var n= parseInt(j);
n=n+1;
alert(n);
$("#countnumber").text(n);
$("#No").text(n);
var html="<input type='text' id='No' placeholder='No'>"+
"<input type='text' id='itemNo' placeholder='itemNo'>"+
"<input type='text' id='itemName' placeholder='itemName'>"+
"<input type='text' id='comNo' placeholder='comNo'>"+
"<input type='text' id='comName' placeholder='comName'>"+
"<input type='checkbox' id='dateControl' placeholder='dateControl'>"+
"<input type='text' id='chkProdDate' placeholder='chkProdDate'></br>";
$(".item").append(html);
var No=n;
var itemNo="itemNo";
var itemName="itemName";
var comNo="comNo";
var comName="comName";
var dateControl="dateControl";
var chkProdDate="chkProdDate";
var item=[itemNo,itemName, comNo, comName,dateControl,chkProdDate];
var len=item.length;
var arr=[];
for(var i=0;i<len;i++){
arr[i]=i;
}
$.each(arr,function(i){
debugger;
var idValue=item[i];
if(idValue!=''){
$(".item input").eq(i).attr("addVal",n);
$(".item input").eq(i).attr("id",idValue+n);
$(".item input").eq(0).val(No);
}
});
});
jsp代码
<body>
<input type="button" id="addOneMoreLine" name="add" value="add"/>
<input type="button" id="count" name="count" value="count"/>
<div id="countnumber">0</div>
<form name="form1" action="findAllCate.do" method="post">
name:<input type="text" name="user_name" id="user_name"/>
<br>
password:<input type="password" name="user_pwd" id="user_pwd"/>
<input type="submit" value="submit"/>
</form>
<form name="form2" action="submit.do" method="post">
<div class="itemTopic">
<span class="No" style="width:173px;">序列号</span>
<span class="itemNo" style="width:173px;">商品编号</span>
<span class="itemName" style="width:173px;">商品名称</span>
<span class="comNo" style="width:173px;">公司编号</span>
<span class="comName" style="width:173px;">公司名称</span>
<span class="dateControl" style="width:173px;">期限控制</span>
<span class="chkProdDate" style="width:173px;">验证生产期限</span>
</div>
<div class="item">
</div>
</form>
</body>