Need to select all checkboxes and dynamically add specific event handler to each

Question

Given the following repeated markup in a page:

<div>
     <input type="checkbox" id="chk1" />
     <div id="div1" >
          //stuff to toggle
     </div>
</div>
<div>
     <input type="checkbox" id="chk2" />
     <div id="div2" >
          //stuff to toggle
     </div>
</div>

How can I get all checkboxes and then dynamically add toggle to the associated div in an event handler for each checkbox?

$(document).ready(function() {
     $('input:checkbox').each(
          function() {
               $(this).bind('click", function() {
                    //Attach toggle() to associate DIV
                    //$('#div1').toggle();
               });
          });
});

Is there a simple way to do this without resorting to either parsing or assuming an ordered list of IDs?

Matt Ball · Accepted Answer · 2011-06-27 13:15:21Z

3

Use the change event, since that's really what you care about
Use .live() so you only bind 1 listener, rather than 1 per checkbox

Use DOM traversal to find the <div>

$(function ()
{
    $('input:checkbox').live('change', function ()
    {
        $(this).next().toggle();
    });
});

answered Jun 27, 2011 at 13:15

Matt Ball

361k102 gold badges655 silver badges725 bronze badges

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

Comments

Giann · Accepted Answer · 2011-06-27 13:15:45Z

0

You don't need the each() or bind():

$('input:checkbox').click(function (event) {
  //... using $(this)
});

answered Jun 27, 2011 at 13:15

Giann

3,2003 gold badges24 silver badges33 bronze badges

1 Comment

Matt Ball Over a year ago

You also don't need the .bind('click', ...) when .click(...) will do.

Collectives™ on Stack Overflow

Need to select all checkboxes and dynamically add specific event handler to each

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related