0

I read couple articles related to event.stopPropagation(); but none of the solutions provided works for me. Basically what I have is an accordion widget with all the elements collapsed by default. On each element header (dt tag) there is also a checkbox. Clicking the checkbox shouldn't trigger the accordion to make its elements expand.

<dt data-toggle="collapse">
<span class="subscribe-checkbox"><button type="button" class="btn toggle-btn" data-toggle="button"></button></span>
</dt>
<dd>
<p>Accordion content...</p>
</dd>

Clicking the span (which should act as a checkbox) should add class "checked" to it. However it also expands the accordion element (dd tag). What I'm doing in jQuery is:

$('.accordion-group .btn.toggle-btn').click(function (event) {
event.stopPropagation();
});

While the accordion content isn't shown (which is good) the <span> element doesn't change class either, so it doesn't become 'checked'. I tried with .live() too and didn't work either.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Ciprian Amaritei
  • 73
  • 1
  • 8

2 Answers2

1

You have to use addEventListener and then use the boolean Capture argument to control the behaviour of parent elements.

ЯegDwight
  • 24,821
  • 10
  • 45
  • 52
Ralf
  • 11
  • 1
0

stopPropagation() does not work because the <dd> is not a parent to the <span>, so the event does not propagate from the <span> to the <dd>.

You'll have to restructure the handlers a little bit, maybe remove the click handler for the parent element of this whole code, and add a new handler for the <dd>

mihai
  • 37,072
  • 9
  • 60
  • 86
  • Thanks for the answer. So behavior is: - click on
    and
    is displayed. - click on which is inside of
    , span becomes checked and
    not shown So I think the problem is with
    and not with
    and

    . Because the click event is propagated on the

    which is the parent of the span.. Is there something am I missing?
     – Ciprian Amaritei Apr 09 '12 at 11:45
  • I think you need to show more code, what other click handlers do you have in place? – mihai Apr 09 '12 at 12:04