6

jquery ui プラグインを使用して、並べ替え可能なリスト要素にリンクされたドラッグ アンド ドロップを実現しています。ドラッグ可能な要素を移動すると、カスタムの幅と高さでヘルパーが作成されます。要素が並べ替え可能な領域の上にある場合、インライン スタイルが作成され、カスタムの幅と高さに影響します。ヘルパーのサイズが正しくなくなり、並べ替え可能なゾーンの幅の 100% が使用されます。ここで jquery ui の例の例を見ることができますhttp://jqueryui.com/draggable/ # sortable 私の目標は、ヘルパーの高さと幅のインライン スタイルの挿入を防ぐことです。それは可能ですか？

ソート可能な forcehelpersize パラメータを試しましたが、成功しませんでした。

edit : ソート可能な領域にいるときに、ヘルパーが最初の要素のドラッグ可能なサイズを取得することに気付きました。

4

6 に答える 6

5

古い質問ですが、Google は気にしません。したがって、これは一部の人にとっては依然として有用な場合があります。次のように、並べ替え可能なオブジェクトでイベントを使用します。

$('#element').sortable({
    receive: function(event, ui) {
        ui.helper.first().removeAttr('style'); // undo styling set by jqueryUI
    }
于 2014-11-03T08:59:51.363 に答える
1

.ready 関数の先頭で、幅を実際の幅に初期化します。要素が 1 つしかない場合:

$('#myDraggable').css({
    'width' : $('#myDraggable').width()
});

複数の要素がある場合は、次を使用してループできます。

$( "#myDraggable > div" ).each(function( index ) {
    $(this).css({
        'width':$(this).width()
    });
});
于 2015-11-13T15:37:55.463 に答える
0

複製された要素の幅と高さを取得し、それらを使用して複製自体の幅と高さを設定することもできます。

helper: function() {
  var helper = $(this).clone(); // Untested - I create my helper using other means...
  // jquery.ui.sortable will override width of class unless we set the style explicitly.
  helper.css({'width': $(this).width(), 'height': $(this).height()});
  return helper;
}
于 2014-08-12T14:48:00.050 に答える