tr:最后并不总是抓住最后一排

时间:2013-10-17 14:56:12

标签: jquery

我在jquery中使用tr:last命令遇到了一个独特的错误。

我有一个基于.clone()的模板行的动态表。

当我添加一行时,我想增加行数以命名字段

但是因为我也可以删除一行,所以增量因子需要查看最后一行的id,以查看计数是不是新行var,而是max + 1。 (实际上,由于克隆行,最大+2)

我所拥有的是,它每隔一段时间都有效......这很奇怪。

以下是添加3行的示例警报序列。

max = 4 count = 5

max = 4 count = 6

max = 6 count = 7

因此,找到5的最大值实际上并不会发生。

function addrow(table){
var className;
var count = $("#"+table+" tbody tr").length;
//since we have a th that server-side prints, no need to count++.  if th removed, count++ this.

//in case of rows removed, need to find last row and check its number...
var max = $("#"+table+" tbody tr:last").attr('id').split("_").pop();
alert('max='+max+'   count='+count);
if(parseInt(max)+2>count){
    count = max;
}

var $clone = $("#"+table+" tbody tr:first").clone();
$clone.attr({
        id: "dynrow_" +$('#'+table).attr("id")+"_"+ count.toString(),
    "class": "" , //remove template class
    style: "" // remove "display:none"
    });
$clone.find("input,select,textarea").each(function(){
    var xname = $(this).attr("name") + count.toString();
        $(this).attr({
            id: $(this).attr("id") + count.toString(),
            name: xname
        });     
    //populate fields that don't exist on page build by reading datacollector div with html5 data 
    $(this).val($("#datacollector").data(xname));
});

if(count%2==0){
    className="even";
}
else{
    className="odd";
}

$clone.find("td").each(function(){
    if($(this).hasClass("xcol")){
        className = className + ' xcol';
    }
        $(this).attr({
            'class': className
        });                 
});
$clone.find("label").each(function(){
        $(this).attr({
            "for": $(this).attr("for") + count.toString()
        });
});
$clone.find("a.removerow").each(function(){
        $(this).attr({
            id: $(this).attr("id") + count.toString()
        });
});
$("#"+table+" tbody").append($clone);

//update row counter
$("#initialrows_"+table).val(count.toString());

}

<input type="hidden" id="initialrows_table_aaa" name="initialrows_table_aaa" value="1">
<table id="table_aaa" class="dynrow">
<thead>
    <tr>
        <th>A</th>
        <th>B</th>
        <th>C</th>
    </tr>
</thead>
<tbody>
<!--template-->
    <tr class="template" id="template_aaa" style="display:none;">
        <td class="even"><label for="inp_16">a</label><input type="text" name="a_" id="inp_16" value=""></td>
        <td class="even"><label for="inp_17">b</label><select id="inp_17" name="b_">
            <option value="">Select</option>
            <option value="A">A</option>
            </select>
        </td>
        <td class="even"><label for="inp_18">c</label><select id="inp_18" name="c_">
            <option value="">Select</option>
            <option value="A">A</option>
            </select>
        </td>
    </tr>
<!--end template-->
</tbody>

工作小提琴, http://jsfiddle.net/briansol/5h4cM/1/

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

这是问题所在:

if (parseInt(max)+2>count){
    count = max;
}

因此,当您添加一行max = 4 count = 6max + 2 = 6时,count (6)不会超过count,因此id不会增加,因此会添加另一行具有相同的{{1}}。

Here's a fiddle