jquery - DIV 会在 15 秒后自动消失，除非有人在 DIV 内点击

Question

我有一个网站，加载如下：

<div class"overlay">
<div id="hideMsg">15 </div>
<div class="mainbox">
</div>
</div>

目前覆盖在 15 秒后消失，但如果有人在 div 主框内单击，我想阻止这种情况发生。（例如 box div 将不再消失。同时，我也希望倒数计时器消失，因为它不再需要了。

我正在使用的代码是：

使 div 消失

$(document).ready(function()  {
    setTimeout(function() {
        $(".overlay").fadeOut(1500);
    },15000);
        });

用于倒数计时器

var sec = 15
var timer = setInterval(function() {
   $('#hideMsg span').text(sec--);
   if (sec == -1) {
  $('#hideMsg').fadeOut('fast');
  clearInterval(timer);
   } 
}, 1000);

我想我需要以某种方式停止该功能，但不知道该怎么做。真的很想看看最好的方法是什么。

谢谢，

斯科特

Answer 1

尝试清除onclick.mainbox

$(document).ready(function()  {
    var mTimer = setTimeout(function() {
        $(".overlay").fadeOut(1500);
    },15000);

    $('.mainbox').click (function () {
       clearTimeout(mTimer);
       $('#hideMsg').fadeOut(100);
    });
});