3

我实际上正在尝试制作一个 .php 页面，其中我将有 3 个可拖动元素，这些元素必须被拖动到 3 个可放置元素 - 每个可拖动到可放置元素，并且它们是唯一的，因此每个可放置元素只会接受某个可拖动元素.

问题是我需要控制所有元素都被拖到正确的位置，在这种情况下，我应该将用户重定向到success.php，否则，如果某些元素被拖到错误的droppable，用户必须转到例如 failure.php。

无论如何，例如在 PHP 中的 $_SESSION 中保存某个值，以便知道所有可拖动对象都已放置在正确的位置？

这是拖放的代码：

$(function() {
    $("#draggableLeiden").draggable();
    $("#draggableTheHague").draggable();
    $("#draggableRotterdam").draggable();

    $("#droppableLeiden").droppable({
        accept: '.imgLeiden',
        drop: function(event, ui) 
        {
            $(this).addClass('ui-state-highlight');

        }
    });
    $("#droppableTheHague").droppable({
        accept: '.imgTheHague',
        drop: function(event, ui) 
        {
            $(this).addClass('ui-state-highlight');

        }
    });
    $("#droppableRotterdam").droppable({
        accept: '.imgRotterdam',
        drop: function() 
        {
            $(this).addClass('ui-state-highlight');
            //var activeClass = $(this).droppable('option', 'activeClass','ui-state-highlight');
        }
    });
});

我正在尝试这样做，例如获取可放置元素的活动类以查看它是否与“ui-state-highlight”匹配，但实际上，每次重新加载页面时都会执行该标签，所以如果我尝试插入任何代码放入
drop: function() 它将始终执行。

提前非常感谢！

4

2 回答 2

1

您是否偶然寻找ui.draggable它包含被丢弃的元素？

http://jqueryui.com/demos/droppable/

$('#target').droppable({
    drop : function(event,ui){
            if($(ui.draggable).attr('id') == "correcttarget")
            {
                    window.location = "yay.php";
            }
            else
            {
                    window.location = "awwww.php";
            }
    }
})
于 2010-01-30T20:01:18.650 回答
1

请改用还原选项。当一个可拖动元素被放置在除已接受的可放置元素之外的任何东西上时，它将滑回其原始位置。这对你有用吗？

于 2010-01-24T21:40:29.453 回答