jquery - fadeToggle 使用切换功能

Question

这是我的代码:

$('#retouche_a_faire').click(function() {
$("#retouche_a_faire_alert").toggle(this.checked);
});

效果很好。基本上，它是一个使 div 在选中“retouche_a_faire”复选框时出现，在未选中时消失的函数。但我想使用 fadeToggle 选项而不是 toggle。我怎样才能做到这一点？

我尝试过:

$('#retouche_a_faire').click(function() {
$("#retouche_a_faire_alert").fadeToggle(this.checked);
});

但它不起作用，因为我认为我需要设置持续时间和缓动...但我也需要在括号中使用“this.checked”...我有点困惑。

谢谢!

Answer 1

http://jsfiddle.net/a6Dkw/4/

在这种情况下，您不想使用 fadeToggle() ，除非您知道它将以 display:none 开头，测试它是否被选中要安全得多。另外，如果您使用的是 jQuery 1.7.2，则可以使用 .on('click') 和 .prop()

$('#retouche_a_faire').on('click', function() {
    if ($(this).prop('checked')) {
        $("#retouche_a_faire_alert").fadeIn();
    }
    else {
        $("#retouche_a_faire_alert").fadeOut();
    }
});​