setTimeout和clearTimeout替代点击

我想创建一个任务管理系统的前端，我卡在一个setTimeout问题。我试图做到这一点，当用户点击复选框时，瓦片会消失到33％不透明度/切换“完成”类，等待2秒钟，然后消失;如果用户在消失之前再次点击复选框，则任务应切换类并清除超时。setTimeout和clearTimeout替代点击

我在使用clearTimeout命令时遇到了很多麻烦。我已经在相关块之外声明了我的计时器变量，尝试将clearQueue（）和stop（）命令添加到我的函数中，并尝试使用三重检查拼写。

我的JS小提琴在这里：http://jsfiddle.net/sLYA9/。

这里是我的相关JS：

$('#alltasks .taskitem form').click(function (event) { 
    event.preventDefault(); 
    // Variables for different referenced elements 
    var tile = $(this).parent('.taskitem'); 
    var taskContents = '<div class=\'taskitem\' draggable=\'true\'>' + tile.html() + '</div>'; 
    var timer; 

    // Unchecking a checked task 
    if (tile.hasClass('completed')) { 
    clearTimeout(timer); 
    tile.clearQueue().stop().fadeTo(300, 1); 
    } else { // Checking an unchecked task 
    tile.fadeTo(300, 0.33); 
    timer = setTimeout(function() { 
     alert("the task disappears"); 
    }, 2000); 
    } 
    tile.toggleClass('completed'); 

});

同样，我希望用户能够在2000毫秒定时器之前再次单击该复选框并清除计时器。

任何想法我错过了什么？

编辑：我现在觉得很傻。将定时器声明移到点击处理函数之外使其正常工作。

来源

2013-10-21 Lee

您的计时器在第一个“点击”功能中进行了限定。如果您将var定时器移到点击回调之外，它就会起作用。你可以检查计时器何时启动，看看它是否仍然“完整”

来源

2013-10-21 18:09:54 jeremy

计时器的范围是本地的，所以每次调用时都有一个新的范围。

变量计时器需要在点击函数之外声明。

来源

2013-10-21 18:06:01 epascarello

哇，我觉得自己像个白痴。谢谢！（我刚刚移动了我的var计时器;离开了我的点击处理函数） – Lee

setTimeout和clearTimeout替代点击

回答

相关问题