Question

我想在同一个jQuery中使用.fadeIn()，.fadeOut()来表示两个不同的函数。

例如：想象一下表单

假设以下是radiobuttons：

美国 - 如果我选择美国它会淡化 - 美国的城市/省份 O Canada.-如果我选择加拿大它会淡化 - 美国的城市/省份

另一个radiobutton：//这与上面的radiobutton（美国，加拿大）之间没有关系

男性 - 它应该在酒吧，酒吧等消失 O女 - 它应该在购物中心，水疗中心等消失

我怎么能在jquery中做？

Answer 1

jsFiddle Demo

如果我理解得很好，这应符合您的需要。

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();
});

在jquery中fadeIn和淡出？

1 个答案: