鼠标悬停时暂停或重置延迟计时器答案

【问题标题】：Pause or reset delay timer on mouseover鼠标悬停时暂停或重置延迟计时器
【发布时间】：2020-06-04 23:01:51
【问题描述】：

我正在创建一个延迟 7000 的 toast 通知（企业标准规定，这些通知只能停留在 7000 左右），但想在鼠标悬停时暂停它。

我的代码在这里：

$(document).ready(function(e) {
        var notificationDate = "2020-06-03 15:25:34"; // we will pull this time from the AssetWise DB on the notification

$(function(notifications){
         notify({
                    type: "reload", //alert | success | error | warning | info | reload
                    title: "",
                     position: {
                        x: "center", //right | left | center
                        y: "top" //top | bottom | center
                    },
                    icon: '<img src="images/reload.png" />',
                    size: "normal", //normal | full | small
                    overlay: false, //true | false
                    closeBtn: false, //true | false
                    overflowHide: true, //true | false
                    spacing: 0, //number px
                    theme: "default", //default | dark-theme
                    autoHide: true, //true | false - does it auto close
                    delay: 7000, //number ms
                    onShow: null, //function
                    onClick: null, //function
                    onHide: null, //function
                    message: "There are active notifications that you have seen before. Do you want to re-load the current notifications?<br><center><input id='yes' type='button' value='Yes' />&nbsp; <input id='no' type='button' value='No' title='By clcking No, you will not be able to see the notifications again!' /></center>",
                   // template: '<div class="notify"><div class="notify-text"></div></div>' //
                    });

    $(function(){
        $("div[class*=notify").on('hover',function(){
        // this is where I want to delay or reset the 7000 delay
        });                 

        $('#yes').click(function() {
        $.cookie("notificationCookie", null);
        window.location.reload(false)
        });
        $('#no').click(function() {
        $.cookie("notificationCookie", notificationDate + ":no");
        });
    });

     }
}
);
);

当用户将鼠标悬停在 div 上时，我试图让“delay:7000”暂停或重置（内容进入具有以“notify”开头的类的 div）。

页面编译后的 HTML 源代码如下所示：

<div class="notify reload notify-without-title notify-top-center" style="cursor: pointer;">
  <div class="notify-icon">
   <div class="notify-icon-inner" style="margin-top: -12px;">
    <img src="images/reload.png">
   </div>
 </div>
<div class="notify-text"><p>There are active notifications that you have seen before. Do you want to re-load the current notifications?<br></p><center><input id="yes" type="button" value="Yes">&nbsp; <input title="By clcking No, you will not be able to see the notifications again!" id="no" type="button" value="No"></center><p></p>
    </div>
 </div>

提前致谢。

【问题讨论】：

标签： jquery timer reset pause

【解决方案1】：

请将extendedTimeOut”的参数也设置为“0”。
如下所示。

 'options' => [
    'closeButton'       => true, 
     ..........................,
      'extendedTimeOut'   => 0,
     ..........................,
      ]

【讨论】：