1

我的脚本发生了一件奇怪的事情。

实际上,我有一个可以添加/删除行的表。当我删除一行时,每行的索引都会更新。具体来说,如果有 5 行,如果我删除第 2 行,第 3 行的索引变为 2,第 4 行的索引变为 3,等等。

奇怪的是,除了有 10 行或更多行之外,一切正常。实际上,如果有 10 行,例如,如果我删除第 9 行,则偏移量不起作用。第 10 行的索引仍然是 10,而不是 9。

我不明白我的代码有什么问题。

HTML

<table class="table table-without-padding-bot table-bordered table-striped" id="journey-table">
    <tr>
        <th>#</th>
        <th>Place of departure</th>
        <th>Place of arrival</th>
        <th colspan="2">Distance of one trip</th>
    </tr>
    <tr>
        <td class="journeyNumber"><input type="text" class="input-xsmall" value="1" disabled /></td>
        <td class="departurePlace">
            <div class="input-prepend">
                <span class="add-on"><i class="icon-globe"></i></span>
                <input type="text" class="input-large" name="departurePlace[]" placeholder="Place of departure"/>
            </div>
        </td>
        <td class="arrivalPlace">
            <div class="input-prepend">
                <span class="add-on"><i class="icon-globe"></i></span>
                <input type="text" class="input-large" name="arrivalPlace[]" placeholder="Place of arrival"/>
            </div>
        </td>
        <td class="oneTripDistance">
            <div class="input-append">
                <input type="text" class="input-mini text-center" name="oneTripDistance[]"/>  
                <span class="add-on">km</span>
            </div>
        </td>
    </tr>
</table>
<button class="btn btn-info" id="add-line"><i class="icon-plus"></i> Add another</button>

JavaScript

$('#journey-table').on('click', '.delete-line',function() {

    var trIdToDel = $(this).parents("tr:first").find('.journeyNumber input').val();

    $('#journey-table .journeyNumber input').each(function(){

        if ($(this).val() > trIdToDel)
        {
            var newVal = $(this).val()-1;
            $(this).closest('tr').attr('id', newVal);
            $(this).val(newVal);
        }
    });

    $(this).closest('tr').remove();
    numJourney = numJourney-1;
    updateTotalRequest();
});

$('#add-line').click(function(e)
{
    e.preventDefault();

    numJourney = numJourney+1;
    newJourneyLine = $('#journey-table tr:nth-child(2)').clone();
    newJourneyLine.find('.journeyNumber input').attr('value', numJourney);
    newJourneyLine.append('<td><a href="#" class="delete-line"><i class="icon-remove"></i></a></td>');

    $('#journey-table').append(newJourneyLine);
});
4

1 回答 1

1

错误是您正在比较字符串,而不是整数。

改变

if ($(this).val() > trIdToDel)

if (parseInt($(this).val(),10) > parseInt(trIdToDel,10))

因为"10"<"2"true.

更一般地说,您最好解析所有值以避免考虑太多。$(this).val()-1会工作,但$(this).val()+1不会。

于 2013-08-14T09:32:20.613 回答