0

目前,我的可拖动对象可以放在网格中的任何位置。

如果它们没有放在样式突出显示的区域中,我需要将它们还原。

我该怎么做?

目前,如果它们没有从可拖动的网格中掉落,我已经让它们恢复,就像这样......

    $('.drag').draggable({

    helper: 'clone',
    snap: '.drop',
    grid: [60, 60],
    revert: 'invalid',
 });

这是选择所需拖放区域的功能...

    $('#pickNext').mousedown(function() {
    // remove the class from all td's
    $('td').removeClass('spellword');
    // pick a random word
    var r = rndWord;
    while (r == rndWord) {
    rndWord = Math.floor(Math.random() * (listOfWords.length));
}
    // apply class to all cells containing a letter from that word
    $('td[data-word="' + listOfWords[rndWord].name + '"]').addClass('spellword');
});

像这样的东西...

    $('.squares').draggable({

    drop: function(event, ui){
    if (squares.drop ! word) {
    revert: 'invalid'
    }

  }

});

或这个..

$('.squares').draggable({

    drop: function(event, ui) {
        if ($(this).text() == $(ui.draggable).text().trim()) {
            revert: 'valid'
        }
                else {
                revert: 'invalid'
    }
                }
});
4

1 回答 1

0

drop每次开始拖动字母时,您都需要创建与给定字母匹配的新区域。目前,每个字母都是一个droppable,这不是你想要的。

为此,我修改了您的 JSFiddle 以使用makeDroppables()每次开始拖动字母时调用的函数创建拖放区。

工作 JSFiddle

注意:答案已编辑以更紧密地适合问题。

此外,来自可拖动的jQuery UI 文档:

“如果设置为无效,则只有在可拖动对象未放置在可放置对象上时才会发生还原。”

于 2012-07-31T18:13:42.357 回答