1

刚刚回答了我的另一个问题（模态在下降时没有打开）。现在我有一个新问题：

    $( "#table #food li.corn" ).draggable({
            还原：“无效”，
            hoverClass: "ui-state-active"
    });
    $( "#plate ul" ).droppable({
        hoverClass: "ui-state-active",
        下降：函数（事件，用户界面）{
            $(this).addClass("ui-state-highlight");
            $("#cornDialog").dialog("open");
        }
    });
    $( "#cornDialog" ).dialog({
        自动打开：假，
        显示：“盲”，
        隐藏：“慢”
    });

#cornDialog是当玉米片掉落时将打开的模式。li.corn是“可拖动”的一块玉米， #plate 是“可放置”的 div，但正如您所见，它无法知道正在拖动/放置哪个元素，因此#cornDialog将为每个项目打开. 我需要一种方法来为每块食物（火鸡腿、苹果等）打开一个不同的对话框。说得通？

4

1 回答 1

0

如果为每个可拖动的 li.corn 添加“cornid”的jQuery 数据属性，您可以执行以下操作：

$( "#plate ul" ).droppable({
    hoverClass: "ui-state-active",
    drop: function( event, ui ) {
        $(this).addClass( "ui-state-highlight" ); 
        $( "#cornDialog" + $(ui.draggable).data("cornid") ).dialog( "open" );
    }
});

如果您发布有关如何创建“li.corn”的信息，我可以建议如何添加 jQuery 数据属性。

于 2011-11-11T01:23:43.973 回答