0

複数のドラッグ可能アイテムと 1 つのドロップ可能アイテムを使用できますが、ドロップ可能機能は異なりますか? 私のコードと私の例を見てください。2番目のdivをドロップすると、「もう1つドロップしました」と表示されます。ドラッグ可能な div をさらに作成する予定ですが、この例では、2 つのドラッグ可能なものと 1 つのドロップ可能なもののみを使用しました。

Jsフィドル

JS

$("#draggable_one").draggable({

    revert: true
});


$("#draggable_two").draggable({

   revert: true
});

$("#theonlydroppable").droppable({
    drop: function(event, ui) {
  $(this).html("you dropped one");

    }
});

HTML

         <div id="draggable_one">
          draggable one
         </div>
         <div id="draggable_two">
            draggable two
         </div>

         <div id="theonlydroppable">
            Drop it like it's hot
         </div>
4

1 に答える 1

2

どのドラッグ可能オブジェクトがドロップされたかを確認する条件を追加して、適切なアクションを実行するだけです。

$("#theonlydroppable").droppable({
    drop: function(event, ui) {
        if (ui.draggable.is('#draggable_one')) {
            $(this).html("you dropped one");
        } else {
            $(this).html("you dropped the other one");
        }
    }
});

ここにデモンストレーションがあります：http://jsfiddle.net/yMDB3/1/

于 2012-11-28T09:28:55.667 に答える