Question

I have the following JQuery:

 $('#promotion_profile_offer').live('click', function(e) {
   $('.nooffer').toggle();
 });

which toggles the form, if it detects a click it will hide the form. This works great in the case that the user unchecks the box, but it doesn’t make sense when the checkbox defaults to unchecked and moves to checked.In that case my code would Hidee an offer form, when the user clicks the Offer checkbox.

Therefore How do I do the following:

1. Read the value of the checkbox #promotion_profile_offer
2. Default the .nooffer class to hide() if the #promotion_profile_offer
   box is false

Thank you.

Answer 1

$('#promotion_profile_offer').live('click', function(e) {
   var checked = $(this).is(':checked');

   $('.nooffer')[checked ? 'show' : 'hide']();
 });

Or a easier to read version:

$('#promotion_profile_offer').live('click', function(e) {
   var checked = $(this).is(':checked');

   if (checked === false) $('.nooffer').hide()
   else $('.nooffer').show()
 });