javascript - 表格行的切换位置只能工作一次

Question

我做了一个jsfiddle

我有一个包含文章位置的表格。我会让用户可以通过单击向上或向下箭头来更改位置排序。

但是当我交换一次位置时，我无法再更改已更改行的位置。

函数如下:

function switchPosition( data, direction )
{
    var tableName = "artikelposition";
    currentPosition = parseInt( data['position'] );

    if( direction == "up" )
    {
        newPosition = currentPosition - 1;
    }
    else if( direction == "down" )
    {
        newPosition = currentPosition + 1;
    }

    var otherTr = $("tr[data-position='" + newPosition + "']").data("artikelid");
    console.log("clicked object" + data['artikelid'] + " : current position " + data['position'] + " : new position " + newPosition);
    console.log("other objekt" + $("#" + otherTr).data("artikelid") + " : current position " + $("#" + otherTr).data("position") + " : new Position " + currentPosition);

    $( "#" + data['artikelid'] )
        .data({
            "position": newPosition
        });
    $( "#" + data['artikelid'] + " td.tdArticleNumber span.spanPositionNummer" )
        .html( newPosition );


    $( "#" + otherTr )
        .data({
            "position": currentPosition
        });
    $( "#" + otherTr + " td.tdArticleNumber span.spanPositionNummer" )
        .html( currentPosition );

    sortTable( tableName );
}

Answer 1

正如 ASGM 已经提到的，问题出在 otherTr 上。在这一行中:

var otherTr = $("tr[data-position='" + newPosition + "']").data("artikelid");

我仍然不知道为什么这个表达式总是返回第一个 tr 的 data-artikelid，但是如果你想保存你的代码，那么你可以使用 replace这一行是这样的:

$("#artikelposition tr").each(function()
{
    var that = $(this);
    if (that.data("position") == newPosition)
    {
        otherTr = that.data('artikelid');
    }
});

正如 Pawel 所说 there in comments ，问题是 data-position 是动态设置的。但即使是他使用 $("...").attr("data-...", value) 的想法似乎也行不通。