Переключить выпадающий список для каждого элемента @item

Question

Переключить выпадающий список для каждого элемента @item

0

Мне нужен код ниже для переключения на @item ["name"]. Но всплывающие окна отображаются для всех элементов (5 записей) вместо одного.

Как я могу это изменить.

<script>
    $(document).ready(function () {
        $(".name").click(function () {
            $(".dropdown").fadeToggle("slow");
        });
    });
</script>

Таблица:

<table class="diag" style="background: url('.png');border:none">
     <tbody>
          @foreach (var item in Model.project)
          {                            
               @:<tr>
                 <td class="image">
                     <img src="@item["image"]" />
                 </td>
                 <td class="name">@item["name"]</td>

                 <td class="dropdown">
                    <ul>
                       <li>Option 1</li>
                       <li>Option 2</li>
                       <li>Option 3</li>
                       <li>Option 4</li>
                       <li>Option 5</li>
                    </ul>
                </td>

              @:</tr>
           }
     </tbody>
</table>

user3288249 18 фев. 2014, в 17:47

Источник

Теги:

jquery

html

asp.net-mvc

jquery-ui

1 ответ

Ещё вопросы

curtisk · Accepted Answer · 2014-02-18T14-19-00.000Z

Он переключает все 5, потому что все 5 списков параметров имеют одинаковое имя класса "выпадающее меню", поэтому вы нажимаете на любое имя, как оно есть, и все они переключаются

Быстрое решение - использовать контекст щелчка, чтобы вы знали, какой список опций отображать/скрывать

$(document).ready(function () {
    $(".dropdown").hide();
    $(".name").click(function () {
         $(this).next(".dropdown").fadeToggle("slow");
    });
});

Здесь jsfiddle показывает это в действии

EDIT: добавлено начальное скрытие на основе комментария ниже

Спасибо, я не хочу, чтобы раскрывающиеся списки открывались при первом запуске страницы, как я могу это сделать.
просто, просто добавьте $ (". dropdown"). hide (); перед $ (". name"). щелкните часть