Question

我正在努力让一系列jQuery事件正常工作，所以我可能做错了。

我正在尝试将一个gif图像显示在div中，停留几秒钟，然后淡出并在div中显示不同的随机图像。

由于涉及到cookie，这一点很复杂，但我似乎有这个功能。

此刻，gif图像和随机图像同时出现，然后两者同时淡出。我无法弄清楚为什么会发生这种情况，因为我正在链接事件并在它们之间使用.delay。

我拥有的是：

{
    $(document).ready(function() {
        var images = ['1.gif', '2.gif', '3.gif', '4.gif'];
        var COOKIE_NAME = 'lucykydip_cookie';
        jQuerygo = jQuery.cookie(COOKIE_NAME);
        $("a.start").click(function() {
            $("a.start").hide();
            if (!jQuerygo) {
                $.cookie(COOKIE_NAME, 'ld_cookie');
                $('#luckydip').css("background-image", "url(ajax-loader.gif)").delay(5000).fadeOut("slow").delay(5000).html('<img src="' + images[Math.floor(Math.random() * images.length)] + '" style="width: 82px; height:82px; display: block;" />');

            }

            else {

                $('#luckydip').append('<p>Sorry, our records show that you have already received a voucher code!</p>');
}

感谢任何帮助！

由于

Answer 1

.delay()仅影响动画队列。 .html()命令忽略了这些延迟。

所以你可以使用在显示动画完成后执行的.show()的回调函数：

http://api.jquery.com/show/

.show（duration [，callback]）

持续时间确定字符串或数字   动画运行多长时间。

回调一次调用的函数   动画完成。

.delay(5000)
.show(1, function(){ $(this).html("Hello World"); })

使用.delay使用jquery链接事件

1 个答案: