Javascript jQuery setTimeout-用于更新数据时不工作

我有一个缩略图列表。当我点击缩略图时，我希望在半秒钟后加载图像。这是我的密码：

$('ul#thumbs li img').click(function() {

    setTimeout(function() {
        $('img#image').attr("src", $(this).attr("src").replace("_thumb", ""));
    }, 500);

});

当我点击其中一个拇指时，什么也没发生。如果我删除setTimeout函数，并立即加载图像，它就可以正常工作

有人知道为什么这项活动不会举行吗？

这不是你想象的那样。使用setTimeout时，当函数执行时，它不再是对当前元素的引用

您需要确保跟踪正确的元素，如下所示：

$('ul#thumbs li img').click(function() {
    var thumbImg = this;
    setTimeout(function() {
        $('img#image').attr("src", $(thumbImg).attr("src").replace("_thumb", ""));
    }, 500);

});

---

问题在于超时函数的作用域，请尝试以下操作：

$('ul#thumbs li img').click(function() {
    var self = $(this);
    setTimeout(function() {
        $('img#image').attr("src", self.attr("src").replace("_thumb", ""));
    }, 500);

});

或者更好的是：

$('ul#thumbs li img').click(function() {
    var src = $(this).attr("src").replace("_thumb", "");
    setTimeout(function() {
        $('img#image').attr("src", src);
    }, 500);

});

---

注意：如果src属性可以在超时时间内更改，则第二个示例可能不起作用。如果它是静态的，它会工作得很好。有趣的是，我不知道。谢谢