Jesse
Jesse

Reputation: 231

jQuery - How to reduce duplicated code for my situation

Here is my code

jQuery(document).ready(function() {

    if(jQuery('input[name="email_notification"]').is(":checked"))
        jQuery('#your_email').show();
    else
        jQuery('#your_email').hide();

    jQuery('input[name="email_notification"]').click(function(){
        if(jQuery(this).is(":checked"))
            jQuery('#your_email').show();
        else
            jQuery('#your_email').hide();
    });
});

I have a lot of code doing this tedious job. When page loaded, check if a element is checked and show/hide another element. Then, bind a click event to do it again.

Is there way that can ease my coding life.....

Thanks in advance.

Not good at English and wish some editors can give this question a more clear title.

Upvotes: 1

Views: 90

Answers (2)

Ram
Ram

Reputation: 144679

Just bind your handler and trigger the event on DOM Ready.

$(document).ready(function() {
    $('input[name="email_notification"]').change(function(){
        $('#your_email').toggle(this.checked);
    }).change();
});

Upvotes: 3

Mortalus
Mortalus

Reputation: 10712

try something like this:

function handleEmailDisplay($EmailContainer)
{
    if($EmailContainer.is(":checked"))
        jQuery('#your_email').show();
    else
        jQuery('#your_email').hide();
}

jQuery(document).ready(function() {

    handleEmailDisplay($('input[name="email_notification"]'))

    jQuery('input[name="email_notification"]').click(function(){
        handleEmailDisplay($(this))
    });

});

Upvotes: 0

Related Questions