Zwei ziehbare und zwei dropables auf einer einzigen Seite

Question

Ich habe zwei Sätze von ziehbaren und zwei Sätze von dropable Elemente.

Was ich will, ist die erste Gruppe von ziehbaren Elementen, die nur innerhalb der ersten Gruppe von Drop-Variablen abwerfbar sind. Die zweite Gruppe von ziehbaren Elementen sollte nur innerhalb der zweiten Gruppe von abtropfbaren Elementen verschoben werden können.

Ein Code-Schnipsel:

// this can be dropped only inside .drop elements 
$('.drag').draggable({ revert: true }); 
$('.drop').droppable({ 
    drop: function() { 
     //   
    } 
}); 

// this can be dropped only inside .drop2 elements 
$('.drag2').draggable({ revert: true }); 
$('.drop2').droppable({ 
    drop: function() { 
     //   
    } 
}); 

So wird ein Benutzer Element nicht mit .drag Klasse fallen kann, in den Behälter .drop2.

Answer 1

This ist was du willst.

Verwenden Sie Accept Eigenschaft von dropable Widget und revert Eigenschaft des ziehbaren Widgets, um dies zu erreichen.