Question

我有这个小插件导致一个元素脉动三次调用.blink（）。在通过jQuery拖拽它后，我试图让它在LI元素上工作.sortable（）;但它似乎不适用于这种情况。

$(function() {
$( "#sortable" ).sortable().blink("update-value", 3, 350);
$( "#sortable" ).disableSelection();
});

BLINK CODE

$.fn.blink = function (cls, times, delay) {
var $self = this.removeClass(cls);
clearTimeout($.fn.blink.handler);
! function animate(times) {
    if (times) {
        $self.toggleClass(cls);
        $.fn.blink.handler = setTimeout(function () {
            animate(times - 1);
        }, delay);
    }
}(times * 2);
return this;
};

Answer 1

如果您正在使用jQueryUI可排序插件，并且如果您想创建一个已拖放（已排序）的闪烁元素，您可能应该使用可排序API中已有的回调：

配置可排序时，可以为更改事件提供回调：

$( ".selector" ).sortable({
    change: function( event, ui ) {}
});

API说：“此事件在排序期间触发，但仅在DOM位置发生变化时触发”

您还可以为更新事件提供回调：

$( ".selector" ).sortable({
    update: function( event, ui ) {}
});

API说：“当用户停止排序并且DOM位置发生变化时，会触发此事件”

在您的情况下，您应该使用更新回调并为您的元素调用blink方法。

注意：拖放元素应该在ui对象中可用，使用console.debug检查ui的内容

Answer 2

对于遇到麻烦的人，我使用“停止”代替更改或更新。当我使用update时，它将在删除该物品之前运行，因此当我访问dom来获取订单时，它没有更新它。当我使用更改时，它会随机触发中阻力。我只能通过使用stop来使它工作：function（event，ui）{}

Answer 3

您需要使用以下更新事件：

    $( "#sortable" ).sortable({
       update: function( event, ui ) {
       var data = $( "#sortable" ).sortable( "serialize", { key: "sort" } );
       $.post( "url",{ 'data[]': data});
   }});

或获取像这样的数组数据：

var data = $("#sortable").sortable( "toArray" );

see document

在jQuery sortable（）之后调用自定义函数;

3 个答案: