0

jquery uiのドラッグ可能/ドロップ可能を利用する概念実証に取り組んでいます。

ドロップ可能領域にドロップされる div のインデックスに等しい変数を設定する方法を探しています。(「div0」、「div1」、「div2」などの名前の div があるとします...)

したがって、コードが次のようになると想像してください。

<div id="div0" class="draggableDiv">some cotent</div>
<div id="div1" class="draggableDiv">more content</div>
<div id="div2" class="draggableDiv">yet more content</div>

<div class="droppableDiv">drop it here</div>

$(document).ready(function() {
    $('.draggableDiv').draggable({helper: 'clone'});
    $('.droppableDiv').droppable({
        accept: '.draggableRecipe',
        drop: function(ev, ui) { 
            ui.draggable.clone().fadeOut("fast", 
            function() { 
                $(this).fadeIn("fast") 
            }).appendTo($(this).empty());
                        // function to set someVar = div[index];
        }
    });
});

これを達成する最善の方法がわからないので、誰か提案があれば、ガイダンスをいただければ幸いです。

ありがとう！

4

3 に答える 3

2 
<div id="div0" class="draggableDiv">some cotent</div>
<div id="div1" class="draggableDiv">more content</div>
<div id="div2" class="draggableDiv">yet more content</div>

<div id='dropplace' class="droppableDiv">drop it here</div>

<script language='javascript'>

$(document).ready(function() {
    $('.draggableDiv').draggable({helper: 'clone'});
    $('.droppableDiv').droppable({
        accept: '.draggableDiv', //changed this, it was originally 'draggableRecipe'
        drop: function(ev, ui) { 

                //get the index of dropped draggable div
                var divIndex = $('div').index(ui.draggable)
                alert(divIndex) //alert the divIndex to see the result

                ui.draggable.clone().fadeOut("fast", 
                function() { 
                        $(this).fadeIn("fast") 
                }).appendTo($(this).empty());
        }
    });
});
</script>

これをテストしました、それは私のために働きます、そして、希望はあなたのためにも働くでしょう。幸運を

于 2009-02-06T06:45:31.927 に答える
0

行の後に drop: function(ev, ui) { 追加：

var droppedId = ui.draggable.attr("id");

その後、ドロップされたものに応じて、、、または-のいずれかdroppedIdになります。div0div1div2

于 2011-04-08T04:46:13.567 に答える
0

を使用して、divのIDを解析できるはずです

$.droppedItems = {};

var droppedId = $(this).attr('id').replace('droppable', '');
$.droppedItems[droppedId] = ui.draggable.attr('id').replace('div', '');
于 2009-02-05T18:18:19.593 に答える