Question

我正在使用jquery向下滑动div。

由于某种原因，setTimeout无效（看起来像是函数范围问题）。

无法弄清楚以下代码有什么问题。（两个函数都在$（document）.ready（function（）{}）

中

$('.slider-thumb').click(function(){
    var source = $(this).attr("src");
    $('#image_view').css('background-image',"url("+source+")");
    $('#image_view').slideDown(1000, calbck);
    initiate_timeout();

    function calbck(){}
});

function initiate_timeout(){
    var time_out = setTimeout(function() {
        $('#image_view').slideUp(1000, calbck);
    },2000);
}

Answer 1

缩进源代码表明您确实存在一些范围问题。 calbck函数对于单击处理函数是私有的，因此对initiate_timeout函数不可见。要么使calbck成为顶级函数，要么使initiate_timeout成为单击处理函数本地的函数。

$('.slider-thumb').click(function() {
    var source = $(this).attr("src");
    $('#image_view').css('background-image',"url("+source+")");
    $('#image_view').slideDown(1000, calbck);
    initiate_timeout();

    function calbck(){}
});

function initiate_timeout(){
    var time_out = setTimeout(function() {
        $('#image_view').slideUp(1000, calbck);
        }, 2000);
}

Answer 2

您有一些JS错误和范围问题。在尝试解决错误时，为什么要关闭调试？将您的代码更改为：

$('.slider-thumb').click(function(){
    var source = $(this).attr("src");
    $('#image_view').css('background-image',"url("+source+")");
    $('#image_view').slideDown(1000);
    setTimeout(function() {
        $('#image_view').slideUp(1000);
    },2000);  // will start 2 seconds after slideDown starts (which is 1 second after it completes)
});

甚至更好，使用第一个动画的完成功能来设置计时器：

$('.slider-thumb').click(function(){
    var source = $(this).attr("src");
    $('#image_view').css('background-image',"url("+source+")");
    $('#image_view').slideDown(1000, setTimeout(function() {
        $('#image_view').slideUp(1000);
    },1000));  // will stay open for 1 second before sliding up again
});

或者，甚至更好，使用jQuery的延迟/排队，你可以这样做：

$('.slider-thumb').click(function(){
    var source = $(this).attr("src");
    $('#image_view').css('background-image',"url("+source+")");
    $('#image_view').slideDown(1000).delay(1000).slideUp(1000);  // delay 1 sec between effects
});

您尝试传递给slideUp的calbck未在您使用它的范围内定义（在initiate_timout()内）。它对您的点击处理程序是私有的。

jQuery可能有更好的方法来链接效果而不是使用自己的计时器，但是如果它与HTML匹配，我认为这个代码没有理由不起作用。

注意：如果您的背景图片尚未预先缓存，则当您的slideDown启动时，它可能不会立即加载。

Answer 3

你有任何错误吗？您在calbck函数中将slideUp的未定义值传递给setTimeout。

它对我（对我修改过的组织）有用：http://jsfiddle.net/v3cjG/1/

当我运行您的确切代码（http://jsfiddle.net/v3cjG/2/）时，我收到“无法找到变量calbck”的错误 - 我说你传递的var没有定义。

无法让setTimeout在javascript中工作

3 个答案: