jQuery文本未使用fadeIn正确显示

jQuery text not showing properly using fadeIn

本文关键字：显示 fadeIn 文本 未使用 jQuery      更新时间：2023-09-26

我搜索了这个问题，但找不到适合我的解决方案。

我试着做四个复选框，从中只能选择三个。当选中第四个复选框时，会出现一条淡入消息，通知用户限制。这是在文本中淡出的部分：

$('#warning').fadeIn('slow',function() {
        $(this).stop().text("(You can't have more than 3 selected options)");
        setTimeout(function() {
            $("#warning").fadeOut(300);
        }, 2500);
});

我不能延迟，所以我使用了setTimeout。我不明白为什么第一次点击第四个复选框时，消息会立即显示uo。我做错了什么？

还有没有一种方法可以用延迟来代替setTimer？

以下是整个代码的链接：http://jsfiddle.net/e5kns/

尝试将其添加到脚本的开头：

$('#warning').text("(You can't have more than 3 selected options)");
$('#warning').show();
$('#warning').hide();

http://jsfiddle.net/e5kns/2/

使用fadeTo并将css不透明度设置为0…如下所示：

$('#warning').text("(You can't have more than 3 selected options)").css('opacity',0).stop().fadeTo('slow', 1).delay(2000).fadeTo('slow', 0);
相关文章：