jquery - 选择另一个单选按钮时，jQuery隐藏其他div

Question

我需要有关切换单选按钮的帮助。每当我单击其中一个时，它就会像预期的那样打开，但是当我选择另一个时，它不会关闭。我一次只想要一个打开。非常感谢任何帮助 - 谢谢！

这是代码：

jQuery('.selectDiv3').click(function() {jQuery('#div3')[ (jQuery(this).val() == 'NW WI') ? 'slideDown' : 'slideUp']()});

jQuery('.selectDiv4').click(function() {jQuery('#div4')[ (jQuery(this).val() == 'SE MN') ? 'slideDown' : 'slideUp']()});

jQuery('.selectDiv5').click(function() {jQuery('#div5')[ (jQuery(this).val() == 'SW MN') ? 'slideDown' : 'slideUp']()});

jQuery('.selectDiv6').click(function() {jQuery('#div6')[ (jQuery(this).val() == 'SE WI') ? 'slideDown' : 'slideUp']()});

Answer 1

Your click handlers need the ability to close all other divs. So something like this:

jQuery('.selectDiv3').click(function() {
    jQuery('.commonDivClass').slideUp(); // <-- this line
    jQuery('#div3')[ (jQuery(this).val() == 'NW WI')
        ? 'slideDown'
        : 'slideUp']();
});

So you add a class to all your divs (e.g. #3-6) and indiscriminately slide them up before sliding down the correct one.