3

见小提琴:http: //jsfiddle.net/hp7Cz/25/

$('.moveDownLink').click(function() {

var $thisQuestion = $(this).parent();
var originalIndex = $thisQuestion.index();    
var $textField = $(this).next();
var fieldVal = parseInt($textField.val());


        var $target = $('.question:eq('+(fieldVal - 1)+')');
        var $newElement = $thisQuestion.clone().insertAfter($target);
        $newElement.prevUntil(".question:nth-child("+ (originalIndex + 1)  +")").each(function() {
            var $tField = $(this).find('input');
            var val = parseInt($tField.val());
            $tField.attr('value',(val - 1));
        });

        $thisQuestion.detach();




});​

示例代码仅处理向下移动的问题,即从位置 1 到 4 等。奇怪的是,如果首先将问题 1 移动到第 4 位,它将在 Chrome 中工作。但是将任何更高的位置(即问题 2)移到第 3 位将失败,因为 .prevUntil() 不会在选择器中的指定元素处停止并继续枚举所有元素,而与第 n 个子过滤器中指定的索引无关。

在 IE 和 FireFox 中一切正常,每次都正确排序:1,2,3,4

4

1 回答 1

1

当您克隆对象时,您会丢失事件侦听器。对我来说,它在 FF 或 IE 中不起作用。

尝试使用 .on() 代替,http://jsfiddle.net/hp7Cz/30/

$('#container').on("click", ".moveDownLink", function() {}
于 2012-12-02T19:36:48.633 回答