-1

我有一个 div“pushBtns”和一个 ID 为“showPushBtns”的锚标记，“pushBtns”将在页面加载时隐藏，并在页面加载后 5 秒内出现。但是，如果用户单击锚 id“showPushBtns”，它应该停止“timedShow()”函数，并且应该出现 div“pushBtns”。定时显示隐藏功能工作正常，但我无法让“clearTimeout”工作。请协助？

PS我是jQuery的初学者。

<script type="text/javascript">
$(document).ready(function() {
  var theButtons = $("#pushBtns");
  theButtons.hide();
  function showIt(){
     theButtons.show(1000);
  }
  function timedShow() { 
     var timer = setInterval(function() {showIt();},5000);
  }
  timedShow();
  $('#showPushBtns').click(function(){
     clearTimeout(timer);
  });
});
</script>

已回答 http://jsfiddle.net/pcvhG/6/

谢谢@mguimard

var theButtons = $("#pushBtns");
var togglBtn = $("#showPushBtns");
var timer;
$(document).ready(function() {
theButtons.hide();
function showIt(){theButtons.show(1000);}
function timedShow() { setTimeout(function() {showIt();},5000);}
timedShow();
$('#showPushBtns').click(function(){clearTimeout(timedShow());showIt()});
});
4

3 回答 3

3

使用clearInterval，不使用clearTimeout。

或者，使用setTimeoutandclearTimeout应该更适合您的需求。为什么要showIt每 5 秒调用一次？

于 2013-06-19T09:49:47.127 回答
0

您的 timer 变量是 timedShow 函数的本地变量 - 使其成为全局变量，您需要使用clearInterval

$(document).ready(function () {
    var timer;
    var theButtons = $("#pushBtns");
    theButtons.hide();

    function showIt() {
        theButtons.show(1000);
    }

    function timedShow() {
       timer = setInterval(function () {
            showIt();
        }, 5000);
    }
    timedShow();
    $('#showPushBtns').click(function () {
        clearInterval(timer);
    });
});
于 2013-06-19T09:51:05.750 回答
0

clearTimeout(timer)只是清除计时器，因此该函数将永远不会运行。所以需要showIt()清空定时器后执行。

$('#showPushBtns').click(function()
{
   clearTimeout(timer);
   showIt();
});

编辑：还注意到您正在使用setInterval. 你的意思是在那里使用setTimeout吗？

于 2013-06-19T09:53:37.520 回答