在圖像上設置切換

Question

已更改下面的代碼以切換@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> 

Answer 1

既然你沒有提供足夠的信息，在這一刻最好的選擇是：

$(document).ready(function(){ 
    $("td.image img").click(function(){ 
     $("p").toggle(); 
    }); 
}); 

---

編輯：基於您添加的HTML，你需要使用：

$(document).ready(function(){ 
    $("td.image img").click(function(){ 
     $(this).closest('.image').siblings('.dropdown').toggle(); 
    }); 
}); 

Answer 2

<script> 
$(document).ready(function(){ 
    $("img").click(function(){ 
    $("p").toggle(); 
    }); 
}); 
</script> 

當然，如果你有多個圖像和段落，選擇器需要更具體。但是你的代碼不會顯示段落，所以我不能爲此創建一個示例。