0

当你点击一个动作时，我想要完成的是在我的系统上，菜单被隐藏（禁用）并替换为倒数计时器。在倒数计时器到时，我希望菜单被取消隐藏并向下滑动。

当我执行操作时，我会隐藏运行良好的菜单。但是当它倒计时时，我用谷歌搜索了一些并找到了这个并改变它来尝试一下。但这似乎没有任何作用。

这是定时器代码：

 var coolDownTime = 10;

    function coolDownTimer() {
        setTimeOut (function() {
            if(coolDownTime != 0) {
                coolDownTime--;

                coolDownTimer();
            } else {
                $("#target_area").slideDown('medium');
            }
        }, 1000);
    }

这是我隐藏菜单的方法：

 $('[name=action]').click(function () { 
   $("#target_area").slideUp('medium');

   return false;
 });

我在这里做了一些其他的 ajax 来执行一些操作，然后我向上滑动菜单。

在这一点上，我希望倒计时开始，当倒计时结束时，我希望动作回来，以便他们可以选择再次继续。

我认为当前方法的问题是，如果我将该计时器代码放在同一个 click 语句中，我将菜单隐藏在其中就会完全停止工作。我很失落。有没有人做过类似的事情并知道解决方案？

4

1 回答 1

0

经过一点挖掘和逻辑，我想出了这个。.

$('.trigger').on('click', function(e) {
    $(this).html('show')
    $('.show').slideUp('medium');
    var count = 10,
        counter = setInterval(timer, 1000);

    function timer() {
        count--;
        if (count <= 0) {
            clearInterval(counter);
            $('.trigger').html('hide');
            $('.show').slideDown('medium');
            return;
        }
        console.log(count);
        $('.timer').html(count);
    }

});

小提琴

于 2013-07-13T22:31:33.440 回答