我如何使2个函数与jquery中的“或”同时工作？

Question

i have something being done when a radio is checked, however, now i want to make the same thing happen on page load, hopefully without duplicating the bulk of the code.

the reason i'm adding it for page load is because i'm creating an edit/update page. the first page is for saving form data to mysql database, and second page grabs values from database and displays the form as it was saved and a person can make changes and save it back to the database.

so i have this for the click. it's more than this for the other radio values, but don't want to paste too much. this is just example:

$("input[name='typeofmailerradio']").click(function() {
    if(this.value == 'Postcards') {
        $('#typeofpostcardmaileroptions').show("fast");
    }
    else {
        $('#typeofpostcardmaileroptions').hide("fast");
    }
    //more if/else's for more radio values here
});

so i did a test and put all of this into the page code:

$("input[name='typeofmailerradio']:checked").val(function() {
if(this.value == 'Postcards') {
        $('#typeofpostcardmaileroptions').show("fast");
    }
    else {
        $('#typeofpostcardmaileroptions').hide("fast");
    }
    //more if/else's for more radio values here
});

first, that's what i meant by duplicating the bulk of code, and second it didn't really work. it worked for page load, but the section of code for clicking didn't want to work anymore.

what i want to do is an "or" or something. something like this, but don't know how to go about it:

$("input[name='typeofmailerradio']").click(function() || $("input[name='typeofmailerradio']:checked").val(function() {
    if(this.value == 'Postcards') {
        $('#typeofpostcardmaileroptions').show("fast");
    }
    else {
        $('#typeofpostcardmaileroptions').hide("fast");
    }
    //more if/else's for more radio values here
});

by the way, what the proposed solution i wrote doesn't work at all. doesn't work on load and doesn't work when clicking.

doesn't work:

$("input[name='typeofmailerradio'],input[name='typeofmailerradio']:checked").click(function() {
if(this.value == 'Postcards') {
    $('#typeofpostcardmaileroptions').show("fast");
}
else {
    $('#typeofpostcardmaileroptions').hide("fast");
}
//more if/else's for more radio values here
});

doesn't work:

$("input[name='typeofmailerradio'],input[name='typeofmailerradio']:checked").val(function() {
if(this.value == 'Postcards') {
    $('#typeofpostcardmaileroptions').show("fast");
}
else {
    $('#typeofpostcardmaileroptions').hide("fast");
}
//more if/else's for more radio values here
});

this is what i did to make it work...

$(document).ready(function() {
  function typeOfMailer() {

if($('#typeofmailerradio1').is(':checked')) {   
    $('#typeofpostcardmaileroptions').show("fast");
    $('#snapapartoption').hide("fast");
    $('#typeofspecialtymaileroptions').hide("fast");
    $('#typeofmaileroptions').hide("fast");
}

else if($('#typeofmailerradio2').is(':checked')) {
    $('#typeofpostcardmaileroptions').hide("fast");
    $('#snapapartoption').show("fast");
    $('#typeofspecialtymaileroptions').hide("fast");
    $('#typeofmaileroptions').hide("fast");
}

else if($('#typeofmailerradio3').is(':checked')) {
    $('#typeofpostcardmaileroptions').hide("fast");
    $('#snapapartoption').hide("fast");
    $('#typeofspecialtymaileroptions').show("fast");
    $('#typeofmaileroptions').hide("fast");
}

else {
    $('#typeofpostcardmaileroptions').hide("fast");
    $('#snapapartoption').hide("fast");
    $('#typeofspecialtymaileroptions').hide("fast");
    $('#typeofmaileroptions').show("fast");
}

}

$("input[name='typeofmailerradio']").click(function() {
typeOfMailer();
});

typeOfMailer();
});

Answer 1

You can use multiple selectors:

$('input[name=foo],input[name=bar]:checked').whatever();
                  ^---separate them with a comma

Answer 2

Try something like...

$(document).ready( function() {

    function do_stuff() {
        if(this.value == 'Postcards') {
            $('#typeofpostcardmaileroptions').show("fast");
        }
        else {
            $('#typeofpostcardmaileroptions').hide("fast");
        }
        //more if/else's for more radio values here
    }

    $("input[name='typeofmailerradio']").click(function() {
        do_stuff();
    });

    do_stuff();

}

You can't really "reuse" anonymous functions. So define them.