php - 列表 "dropdowns"的问题以及哪个列表项获得下拉列表

Question

我正在为 MMO“公会”开发一个项目，该项目为公会成员提供随机生成的游戏任务。他们可以“阻止”分配三项任务。

列表看起来像这样:

<ul>
    <li class="blocked">Task that is blocked</li>
    <li class="blocked-open">Click to block a task</li>
    <li class="blocked-open">Click to block a task</li>
</ul>

blocked-open 类意味着他们还没有选择要阻止的任务。 blocked 任务意味着他们已经阻止了一个任务。当他们单击列表项时，我希望出现以下内容:

<ul class="tasks-dropdown no-display">
    <li><h1>Click a Task to Block</h1></li>
        <ul class="task-dropdown-inner">
            <?php
                //output all tasks
                    foreach($tasks as $task) {
                        echo '<li class="blocked-option"><span id="'.$task.'">'.$task.'</span></li>';
                        }
            ?>
            <br class="clear" />
        </ul>
</ul>

我不太清楚，当用户点击 .blocked-open 行项目时，如何只他们点击的那个下拉菜单。

在我感到困惑之前，我的 jQuery 看起来像这样。

$("li.blocked-open").click(function() {
    $("ul.no-display").slideToggle("900");
    });

    $(".blocked-option span").click(function() {
        var task = $(this).attr('id');
            alert("You have blocked: " + task);
            location.reload(true);
        });

我通过将下拉菜单放在代码中的一个订单项下进行了测试，它工作正常，但是当我在代码中有多个下拉菜单时，单击一个订单项会切换所有下拉菜单。我不知道该怎么办。 :-p.

Answer 1

您的问题是因为您目前无法唯一标识要显示哪个下拉菜单并将其与您单击的项目链接。一种简单但不太灵活的方法是为每个“已阻止”或“已阻止打开”项目分配一个简单的数字 id。然后给每个下拉列表一个id，例如dropdown_1。然后将您的代码调整为如下所示:

$("li.blocked-open").click(function() {
    var id = $(this).attr("id");
    $("#dropdown_"+id).slideToggle("900");
});

我还没有测试过这个，但它应该可以工作......我认为:)