fadeIn和jquery中的淡出？

Question

我想在同一个.fadeIn()中对两个不同的函数使用.fadeOut()和jQuery。

，例如：想象一个表单

假设下面是无线电按钮：

O美国-如果我选择美国it fadeIn -美国的城市/省份-加拿大-如果我选择加拿大it fadeIn -美国的城市/省

另一个无线电按钮: //这和上面的无线电按钮没有关系(美国，加拿大)

O男性-它应该fadeIn酒吧，酒吧等女性-它应该fadeIn购物中心，水疗等。

我如何使用jquery呢？

Answer 1

jsFiddle演示

如果我能理解的话，这应该符合你的需要。

HTML

    <input type="checkbox" id="group1Switch" value="group1" /><label for="group1Switch">group 1</label>
&nbsp;&nbsp;&nbsp;
<input type="checkbox" id="group2Switch" value="group2" /><label for="group2Switch">group 2</label>
<br /><br />
<input type="radio" name="fieldSwitch" id="type1Switch" value="type1" /><label for="type1Switch">type 1</label>
&nbsp;&nbsp;&nbsp;
<input type="radio" name="fieldSwitch" id="type1Switch" value="type2" /><label for="type1Switch">type 2</label>

<br /><br />

<fieldset id="group1">
    <legend>Group 1</legend>
    type 1 <input type="text" class="type1" />
    <br />
    type 2 <input type="text" class="type2" />
</fieldset>
<fieldset id="group2">
    <legend>Group 2</legend>
    type 1 <input type="text" class="type1" />
    <br />
    type 2 <input type="text" class="type2" />
</fieldset>

jQuery

$('input[type=checkbox]').click(function(){
    var _this = $(this);

    if( _this.is(':checked') ){
        $('#' + _this.val() ).fadeIn();
    } else {
        $('#' + _this.val() ).fadeOut();
    }
});


$('input[type=radio]').click(function(){
    var _this = $(this);

    $('fieldset input.' + _this.val() ).fadeIn();
    $('fieldset input:not(.' + _this.val() +')' ).fadeOut();
});