Какой кросс-браузерный способ захвата всех нажатий на кнопку? - PullRequest
Новая
       12

Какой кросс-браузерный способ захвата всех нажатий на кнопку?

3 голосов
/ 05 апреля 2010

Какой лучший способ выполнить функцию ровно один раз каждый раз, когда нажимается кнопка, независимо от скорости нажатия и браузера?

Простое связывание обработчика "click" отлично работает во всех браузерах, кроме IE.

В IE, когда пользователь щелкает слишком быстро, запускается только «dblclick», поэтому обработчик «click» никогда не выполняется. Другие браузеры запускают оба события, поэтому для них это не проблема.

Очевидное решение / хак (по крайней мере для меня) - подключить обработчик dblclick в IE, который дважды запускает мой обработчик кликов. Другая идея заключается в том, чтобы отслеживать клики самостоятельно с помощью mousedown / mouseup, который кажется довольно примитивным и, вероятно, относится к среде, а не к моему приложению.

Итак, каков наилучший / обычный / правильный способ справиться с этим? (предпочтительно javascript или jQuery)

Ответы [ 2 ]

1 голос
/ 06 апреля 2010

Mousedown и mouseup работают так же, как функции щелчка, к сожалению, настолько, что когда IE пропускает щелчок из-за двойного щелчка, он также пропускает mousedown и mouseup. В любом случае вы можете добавить как click, так и dblclick к одному и тому же объекту и передавать щелчки через функцию, которая сортирует любой щелчок, происходящий слишком близко к последнему. 

<div onclick="clk()" ondblclick="clk()"></div>

lastclicktime=0
function clk(){
    var time=new Date().getTime()
    if(time>lastclicktime+50){
        lastclicktime=time
        //Handle click
    }
}

Я, кстати, только что обнаружил, что, по крайней мере, в Firefox событию dblclick не дается время события, поэтому мне пришлось разрешить метод Date.

1 голос
/ 05 апреля 2010

В зависимости от вашей ситуации вы можете использовать разные подходы, но я бы предложил использовать обработчики событий с пространством имен с jQuery, например: 

function eventHandler(event) {
    // your handler code here
    doSomeMagic();
}

var element = $('#element');

element.one('click.someNameSpace', function(event){
    // first we unbind all other event handlers with this namespace
    element.unbind('.someNameSpace');

    // then we execute our eventHandler
    eventHandler();
}).one('dblclick.someNameSpace',  function(event){
    // If this fires first, we also unbind all event handlers
    element.unbind('.someNameSpace');

    // and then execute our eventHandler
    eventHandler();
});

Я не уверен, что это сработает так, как вы этого хотите, но я думаю, это начало.

...