Таймер остановки при наведении

Question

Я не JS-кодер.Я знаю достаточно, чтобы заставить вещи делать то, что я хочу, но не мог писать код с нуля.Моя проблема:

У нас есть корзина для покупок, которая при добавлении товара показывает себя в течение 4 секунд, если клиент не наводит курсор на корзину.Я не могу заставить его остановить тайм-аут, когда курсор наведен на него.

$(document).ready(function () {
    setTimeout(function () { $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide(); }, 4000);
});

Answer 1

Сохраните возврат setTimeout() в переменной и используйте его для clearTimeout():

// t is a global scope variable.
// Probably a good idea to use something better than 't'
var t;
$(document).ready(function () {
  // Store the return of setTimeout()
  t = setTimeout(function () { $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide(); }, 4000);
});

$('cart-selector').hover(function() {
   if (t) {
    // Call clearTimeout() on hover()
    clearTimeout(t);
   }
});

Answer 2

Вам необходимо установить таймер на переменную:

var timer1 = setTimeout(function () { ... })

, затем использовать:

clearTimeout(timer1)

Answer 3

Это должно сделать это:

$(document).ready(function () {
    var timeout = setTimeout(function () { $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide(); }, 4000);
    $('#ctl00_ctl00_ctlHeader_divOrderProducts').mouseover(function() { 
         clearTimeout(timeout);
    });
});

Вы сохраняете тайм-аут как переменную, а затем вызываете clearTimeout при наведении мыши на корзину и передаете этот тайм-аут.

Answer 4

Вам необходимо сохранить возвращаемое значение setTimeout(), чтобы позже вы могли использовать его с clearTimeout().Один из способов это сделать так:

$(document).ready(function () {
    var hideTimer = setTimeout(function () {
        $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide(); 
    }, 4000);
    $('#ctl00_ctl00_ctlHeader_divOrderProducts').hover(function() {
        if (hideTimer) {
            clearTimeout(hideTimer);
            hideTimer = null;
        }
    });
});

Если вы хотите снова включить таймер, когда мышь снова покидает тележку (при условии, что #ctl00_ctl00_ctlHeader_divOrderProducts - корзина), вы можете сделать это следующим образом:

$(document).ready(function () {
    var hideTimer;

    function delayHideCart() {
        if (!hideTimer) {
            hideTimer = setTimeout(function () {
                $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide(); 
            }, 4000);        
        }
    }

    delayHideCart();
    $('#ctl00_ctl00_ctlHeader_divOrderProducts').hover(function() {
        if (hideTimer) {
            clearTimeout(hideTimer);
            hideTimer = null;
        }
    }, function() {
        delayHideCart();
    });
});

Answer 5

var timer = window.setTimeout(function () {
 $('#ctl00_ctl00_ctlHeader_divOrderProducts').hide();
if(someCondition)clearTimeout(timer);
}