问题
如何防止 jquery 切换函数在上一个切换动画完成之前运行?
我有一个简单的脚本来根据是否选中复选框来显示或隐藏数据。
JQUERY
$('.a').hide();
$('#CB').change(function () {
if ($(this).is(':checked')) {
$('.b').fadeOut(100, function () {
$('.a').fadeIn();
});
} else {
$('.a').fadeOut(100, function () {
$('.b').fadeIn();
});
}
});
问题
当事件连续触发时,两个元素(在本例中为 .a
和 .b
)一起变得可见。我认为这是因为在再次触发该函数之前之前的请求尚未完成。
CLICK FOR DEMO
最佳答案
http://jsfiddle.net/keypaul/PbS33/5/
$('.a').hide();
$('#CB').change(function () {
if ($(this).is(":checked")) {
$('.b').stop().fadeOut(100, function () {
$('.a').stop().fadeIn();
});
} else {
$('.a').stop().fadeOut(100, function () {
$('.b').stop().fadeIn();
});
}
});
使用 jquery stop()
关于javascript - 如何管理 Jquery 切换淡入淡出动画的排队?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23937593/