Jquery way to hide/unhide div depending on checkbox status


if ($(\'#isAgeSelected\').is(\':checked\')) { $("#txtAge").show(); } else { $("#txtAge").hide(); }

You can shorten this using ternary, some might say it\'s a bit less readable, but that\'s how I would do it:

$(\'#isAgeSelected\').is(\':checked\') ? $("#txtAge").show() : $("#txtAge").hide();

EDIT (14 months later): There\'s a much prettier way to do this, using toggle:

$(\'#isAgeSelected\').click(function() {
    $
("#txtAge").toggle(this.checked);
});

<input type="checkbox" id="isAgeSelected"/>
<div id="txtAge" style="display:none">Age is something</div>​

No comments

Enter your email address:

Delivered by FeedBurner

OR

 Subscribe in a reader

 
Latest Blogs