15

.blink()を呼び出して要素を3回脈動させるこの小さなプラグインがあります。jQuery .sortable()を介してドラッグアンドドロップした後、LI要素で機能するようにしようとしています。しかし、このコンテキストでは機能しないようです。

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

点滅コード

$.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;
};
4

3 に答える 3

47

jQueryUIソート可能プラグインを使用していて、ドラッグアンドドロップ(ソート)された点滅要素を作成する場合は、ソート可能APIですでに使用可能なコールバックを使用する必要があります。

ソート可能を構成するときに、変更イベントのコールバックを与えることができます。

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

APIによると:「このイベントは並べ替え中にトリガーされますが、DOMの位置が変更された場合のみです」

更新イベントのコールバックを与えることもできます。

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

APIによると:「このイベントは、ユーザーが並べ替えを停止し、DOMの位置が変更されたときにトリガーされます」

この場合、updateコールバックを使用して、要素に対してblinkメソッドを呼び出す必要があります。

注:要素のドラッグアンドドロップはオブジェクトで使用可能である必要がありますui。console.debugを使用してコンテンツを確認してください。ui

于 2013-02-11T21:30:48.407 に答える
1

次のような更新イベントを使用する必要があります。

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

または、次のような配列データを取得します。

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

ドキュメントを参照してください

于 2020-10-03T10:20:39.520 に答える
0

問題がある場合は、変更や更新の代わりに「停止」を使用します。updateを使用すると、アイテムがドロップされる前に実行されるため、注文を取得するためにdomにアクセスしても、更新されていません。変更を使用すると、ドラッグの途中でランダムにトリガーされます。stop:function(event、ui){}を使用することによってのみ機能させることができました。

于 2019-12-29T01:25:04.513 に答える