javascript - 点击重置计时器以显示和隐藏 - jquery

标签 javascript jquery timer

我有一个 jQuery 任务,单击按钮后,我必须显示一条文本消息 10 秒,我已经实现了该任务。

现在的问题是,当文本仍然可见时,如果我单击同一个按钮,它应该重置计时器(计时器应该为 0,并且文本应该再次显示 10 秒)。以下是我所做的。你能告诉我我做错了什么吗?

$('#mybtn').live('click', function(e){
   /*mybtn is the button
    mytext is the text that should appear
   */
   e.preventDefault();
   var $mytext = $('#mytext');
   if( $mytext.length >0){ //text is existing or showing
       $mytext.stop();
       $mytext.show().delay(10000).hide(500);
   }
   else{
       $mytext.show().delay(10000).hide(500);
  }

});

最佳答案

试试这个:

var timer;
$('#mybtn').on('click', function(e){   
   var $mytext = $('#mytext');    
   $mytext.show(500);
   clearTimeout(timer);   
   timer = setTimeout(function(){
       $mytext.hide(500)
    },10000);        
});

在这里工作 fiddle :http://jsfiddle.net/jUkbh/

还检查这个 fiddle :http://jsfiddle.net/jUkbh/2/

关于javascript - 点击重置计时器以显示和隐藏 - jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18607623/

相关文章:

css - 为 gif 设置计时器以开始

javascript - Angular 自定义空闲计时器

javascript - 脚本 - 每 x 秒单击一次按钮

javascript - 在 setState 更新状态之前调用渲染

javascript - html - 如何动态更改base64图像

javascript - ajax调用后如何重新加载脚本?

java - Android boolean 定时器时间表

javascript - 下拉菜单中的 jQuery 更改事件

javascript - Javascript 中的繁忙指示器竞争条件

javascript - Jquery 鼠标悬停在 child 身上触发