Firefox上的多个链接<a> and corresponding </a> <div> <a> with same class name jQuery click function

时间:2016-08-17 02:53:49

标签: jquery

I am having a form which lists some entities along with a link (details) that on clicked will toggle the display of the corresponding details block for that link. Right now, I see that I am able to toggle the details block of the first entity if only one is present. But if there are two entities present, I can only toggle the second link... Following is my .gsp file

<% existingMedplans.each { existingMedplan -> %>

   <a href="#" class="detailsLink">Details</a>
   <span id="button">
      <i class="icon-remove"></i>
   </span>
   <span class="planItemDetails">
      <span id="order_label">Dose:</span>
      <span id="order_value">${existingMedplan.dose}</span>
   </span>
<% } %>

The jQuery code is as follows.

<script type="text/javascript">
   jq(".detailsLink").click(function(){
      jq(this).nextAll(".planItemDetails").toggle();
   });
</script>

My display is something like this:

Order_1 (detailsLink)

[Details displayed or hidden ]

Order_2 (detailsLink)

[Details displayed or hidden ]

In this case, clicking the second link loads the block that shows the details of Order_2, but clicking the link corresponding to Order_1 does not show anything. 'existingMedplans' is the list of objects that I want to display. How can I fix this?

1 个答案:

答案 0 :(得分:0)

好的..我发现了我的错误 - 我的脚本在我的gsp代码中..在表单中..移除它,现在它工作正常..