2

我在这里创建了一个 jsFiddle：http: //jsfiddle.net/markrummel/SEQbd/。

我有三个表格行，每行都有一个向上和向下按钮。通过单击 DOWN 按钮，该行将与其下方的行进行切换。通过单击向上按钮，该行将与其上方的行进行切换。

我的代码中的所有内容都可以上下切换行。但是，移动一行后，我无法再移动该行或与之切换的行。我仍然可以移动尚未移动/切换的行。

我需要调用一些函数来刷新tablesDOM或个人trs 吗？我的假设是 jQuery 不再识别这些行。

jsFiddle 上的示例：

  1. 向下移动项目一，
  2. 看到现在项目一和项目二不能上下移动，
  3. 看到第 3 项仍然可以上移。
4

2 回答 2

4

这是因为您破坏了绑定单击事件的元素。您可以通过使用.on处理事件来轻松修复它：

将第一行更改为：

$(document).on("click", 'button.change-rank', function() {

工作演示：http: //jsfiddle.net/SEQbd/2/

但这不是最好的方法。我会确保移动元素而不是一直破坏/创建元素。而不是使用.html()and .html(someStrng)，您可以使用.append( [jQuery Element/DOM Node] )

在此处查看演示：http: //jsfiddle.net/SEQbd/4/

您可以像这样简单地编写代码：http: //jsfiddle.net/3Wkfm/

$('button.change-rank').click(function() {                                                               
    var direction = $(this).attr('data-direction'),
        $original = $(this).closest("tr"),
        $target = direction === "up" ? $original.prev() : $original.next();

    if ( $target.length && direction === "up" ) {
        $original.insertBefore($target);
    }
    else if( $target.length ) {
        $original.insertAfter($target);
    }
});

var a = condition ? c : d和写法一样：

if ( condition ) {
    var a = c;
}
else {
    var a = d;
}
于 2013-02-08T06:05:48.453 回答
0

原因应该是丢失了事件绑定，当您通过 .html() 重建表格时，您需要做的只是将您的函数重新绑定到那些移动的按钮，或者只是不移动按钮，我的意思是只移动第一个 td或者其他的东西。

于 2013-02-08T06:05:35.550 回答