Question

我有以下html

 <img id="voteImgBtn" onclick='editInstr(1);' src="http://site.com/sync.png" width="99" height="99" border="0"  />
                    <script type="text/javascript">
                        function changeImage(a) {
                            document.getElementById("voteImgBtn").src=a;
                        }
                    </script>

然后我在点击时更改图像，并在我的ajax成功后更改如下

 success: function(data){
           changeImage( "http://site.com/syncD.png" );
        }

我想要做的是在changeImage之后延迟并放回旧图像：

 success: function(data){
           changeImage( "http://site.com/syncD.png" );
           delay(500).changeImage( "http://site.com/sync.png" );
        }

但由于某些原因无效。你能给出一个如何解决它的建议吗？

Answer 1

你的函数既不是可链接的也不是jQuery动画，这是delay()唯一可以工作的东西（.fx队列中的任何东西都更精确），试试这样的东西：

success: function(data){
    changeImage( "http://site.com/syncD.png" );
    setTimeout(function() {
        changeImage( "http://site.com/sync.png" );
    }, 500);
}

Answer 2

delay是一个jQuery函数，而不是标准的JavaScript函数。

$().delay()

修改

搜索后，我发现an obscure way使用delay函数实现了这一点（如下所示）。但是，按照其他人的建议，使用setTimeout可能会好得多。

// Queue it in the fx queue $(document).delay(500).queue(function(){ changeImage( "http://site.com/sync.png" ); $(this).dequeue(); }); // Queue it in a custom queue $(document).delay(500, 'myQueue').queue('myQueue', function(){ alert('hello'); }).dequeue('myQueue');

jQuery来回改变图像

2 个答案: