jQuery Ziehen und Ablegen zu markierten Feldern

Question

Ich habe dieses Skript. Nun, ich wollte, dass der Soldat nur an den markierten Boxen fallen gelassen wird. Ich habe versucht, zu akzeptieren: $ (Selektor) und rückgängig: "ungültig", aber es scheint, dass es nicht erlaubt, dass es sogar auf den nicht hervorgehobenen Boxen fallen gelassen wird.

Answer 1

Zuerst alle DropPables deaktivieren, dann während der Drag Start-Routine $('.cell .validmove') DropPable machen, und eine revert: "invalid" -Option zu der ziehbaren hinzufügen, so dass es zurück bewegt, wenn nicht in eine gültige Zelle, wenn das was Sie wollen. Übrigens wäre es wahrscheinlich besser, die Routine zu haben, die Sie im drag() Ereignis unter start() haben, und auf stop() zurückzugehen, da das Ereignis drag() kontinuierlich ausgelöst wird, während Sie sich bewegen.

unit.draggable({ 
    start: function() { 
     startGrid.addClass("validmove").droppable("option", "disabled", false); 
    }, 
    stop: function() { 
     startGrid.removeClass("validmove").droppable("option", "disabled", true); 
    }, 
    cursor: "move", 
    revert: "invalid" 
}); 

Wenn Sie das Gerät an das Netz zu schnappen, entweder ihn anweisen, das Raster/Snap Optionen in draggable() zu verwenden oder einen Code in dem drop() Fall fügen Sie das Gerät, um Platz zu animieren.

NB. Das CSS funktioniert in Chrome nicht richtig, das Raster wird nicht angezeigt, funktioniert in Firefox einwandfrei.