if click then if click on nested div

Question

I'm not quite sure how to click on a div that shows when after you click on the parent..? Make sense?

Here is an example code snippet.

$('.item').bind('click', function(e){
var showme = $(this).find(".itemcontrols");
$(showme).toggle();
}); 

$('#add').bind('click', function(e){
alert();
});     

<div class="item ui-state-default">
    <div class="itemcontrols" style="display: block;">
        <div id="add">add</div>
        <div id="full">full</div>
        <div id="del">del</div>
    </div>
</div>

.item{display:none;}

I'm trying to click on the #add div but the parent div has a toggle show hide on it. — Blynn
– Blynn, Commented Nov 29, 2012 at 18:33
It is not clear what you are trying to achieve.. The code as such looks fine.. Can you be little more specific on which div and what is expected? — Selvakumar Arumugam
– Selvakumar Arumugam, Commented Nov 29, 2012 at 18:34

Alexander · Accepted Answer · 2012-11-29 18:51:05Z

1

You could add an .itemcontrol class to the children of .itemcontrols.

<div class="item ui-state-default">
  <div class="itemcontrols">
    ...
    <div id="add" class="itemcontrol">add</div>
    ...
  </div>
</div>

And stop the propagation of all .itemcontrol elements using the .stopPropagation() function.

$('.itemcontrols .itemcontrol').on('click', function(e) {
  e.stopPropagation();
});

Apart from this, I would recommend you to use .on to bind events, which is the current recommended way.

$('.item').on('click', function(e) {
  $(".itemcontrols", this).toggle();
});

$('.itemcontrols .itemcontrol').on('click', function(evt) {
  evt.stopPropagation();
});

See it live here.

answered Nov 29, 2012 at 18:51

Alexander

23.5k11 gold badges65 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

if click then if click on nested div

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related