jQuery拖放到突出显示的框

Question

我有这个剧本。 好吧，我希望只将士兵放在突出显示的方框处。 我尝试接受：$（选择器）并还原：“无效”，但它似乎甚至在未突出显示的盒子上也不允许将其删除。

Answer 1

首先禁用所有可$('.cell .validmove') ，然后在拖动启动例程$('.cell .validmove')可$('.cell .validmove') ，并在可拖动对象中添加一个revert: "invalid"选项，以便在未放入有效单元格时将其移回，如果那是你想要的。 顺便说一句，您最好在start()下的drag()事件中包含例程，然后在stop()上还原，因为drag()事件在您移动时连续触发。

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

如果要让单元捕捉到网格，请指示它使用draggable()的grid / snap选项，或者在drop()事件中添加一些代码以对单元进行动画处理。

注意 CSS在Chrome中无法正常工作，网格无法显示，在Firefox中可以正常工作。