lundi 29 mai 2017

Hiding/showing class content if checkbox is ticked

Can't seem to get the checkbox section working.

The .hide() works fine, but the else refuses to show it again.

Other versions of the same code mess up other bits of script on the page, and toggle is a no go due to loading time (if a visitor clicks it too early it ends up reversed!)

Essentially, all I'm looking for is to hide the content if the checkbox is ticked, and to show it again if it's unticked.

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

    $('.sponsor_table').hide();
    $('.sponsor_address').hide();
    $('input[type="checkbox"]').click(function(){
        if($('input[name="anonymous_sponsor"]:checked')) {
            $('.sponsor_name').hide();
            $('.sponsor_logo').hide();
            $('.sponsor_website').hide();
        } else {
            $('.sponsor_name').show();
            $('.sponsor_logo').show();
            $('.sponsor_website').show();
        }
     });
    $('input[type="radio"]').click(function(){
        if($('input[name="cb_sponsor_attendance"]:checked').val() == "Yes"){
            $('.sponsor_table').fadeIn('slow');
            $('.sponsor_address').hide();
        }
        else if($('input[name="cb_sponsor_attendance"]:checked').val() == "No"){
            $('.sponsor_address').fadeIn('slow');
            $('.sponsor_table').hide();
        }
    });

});




Aucun commentaire:

Enregistrer un commentaire