Блог

Как я могу узнать, как долго пользователь удерживал нажатой кнопку мыши (в любом месте веб-страницы)? Я хочу выполнить функцию, когда пользователь удерживал кнопку мыши не менее 2-3 секунд (предпочтительно, отменяя нажатие мыши в процессе). Возможно ли это?

Держи, ты идешь:

 $(window).mousedown(function(e) {
    clearTimeout(this.downTimer);
    this.downTimer = setTimeout(function() {
        // do your thing 
    }, 2000);
}).mouseup(function(e) {
    clearTimeout(this.downTimer);
});
  

Живая демонстрация: http://jsfiddle.net/simevidas/Pe9sq/2 /

С другой стороны, я бы поэкспериментировал с $("body").mousedown(function(){}) использованием jQuery и $("body").mouseup(function(){}) . Я думаю, вы можете запустить таймер, который вызовет функцию через 2-3 секунды. Если mouseup произойдет событие, то вы можете отменить таймер. Вероятно, вы могли бы протестировать это с помощью простого скрипта, но вам, возможно, придется рассмотреть случаи, когда click это могло произойти из-за нажатия ссылки или кнопки на странице. Но в качестве отправной точки я бы поэкспериментировал с $("body").mousedown и $("body").mouseup . Если у меня будет возможность, я посмотрю, смогу ли я отправить пример кода.

Попробуйте это:

 function WhateverYoudLikeToExecWithinNext3Seconds(){
    // Code goes here.
}

element.addEventListener('mousedown', function(){
    setTimeout(function(){WhateverIdLikeToExecWithin3Seconds();}, 3000);
}, false);
  

Посмотрите на это. http://jsfiddle.net/b1Lzo60n

При наведении курсора мыши запускается таймер, который проверяет, по-прежнему ли мышь отключена через 1 секунду.

 <button id="button">Press me</button>
<div id="log"></div>
  

Код:

 var mousedown = false;
var mousedown_timer = '';
$('#button').mousedown(function(e) {
    mousedown = true;
    $('#log').text('mousedown...');
    mousedown_timer = setTimeout(function() {
        if(mousedown) {
            $('#log').text('1 second');
        }
    }, 1000);
}).mouseup(function(e) {
    mousedown = false;
    clearTimeout(mousedown_timer);
    $('#log').text('aborted');
});