Отличить одного и двойной

Question

У меня есть следующий фрагмент кода для различения между щелчками и DoubleClick для:

observeSingleAndDoubleClick: function (element, singleClickHandler, doubleClickHandler, timeout) { 
    var clicks; 
    $(element).observe('click', function (event) { 
     ++clicks; 
     if (clicks === 1) { 
      var timeoutCallback = function (event) { 
       if (clicks === 1) { 
        singleClickHandler.call(this, event); 
       } else { 
        doubleClickHandler.call(this, event); 
       } 
       clicks = 0; 
      }; 
      timeoutCallback.bind(this).delay(timeout/1000); 
     } 
    }.bind(this)); 
} 

Проблемы: событие не живет больше, когда обратный вызов задержки вызывается. Хотя он работает в Firefox, но это не в IE8. Объект события, переданный обработчикам кликов, является «мертвым», так как само событие уже передано.

У кого-нибудь есть совет, как решить эту проблему?

Answer 1

Я знаю, что проект OpenLayers противостоит чему-то подобному. Посмотрите на строку 210 в этом файле: OpenLayers.Handler.Click sourcecode.

Я не знаю, как использовать это с рамками прототипа, но я надеюсь, что вы можете получить на правильном пути :)

Другое дело: было бы не лучше использовать событие MouseUp вместо щелчок?

Answer 2

Не только наблюдать событие щелчка, но и событие doubleclick.

$(element).observe('click',singleClickHandler); 
$(element).observe('dblclick',doubleClickHandler); 

Вот измененная версия после всех обсуждений:

var clicks;  
observeSingleAndDoubleClick: function (element, singleClickHandler, doubleClickHandler, timeout) { 

$(element).observe('click', function (event) { 
    ++clicks; 
    if (clicks === 1) { 
     var timeoutCallback = function (event) { 
      if (clicks === 1) { 
       singleClickHandler.call(this, event); 
      } else { 
       doubleClickHandler.call(this, event); 
      } 
      clicks = 0; 
     }; 
     timeoutCallback.bind(this, event).delay(timeout/1000); 
    } 
}.bind(this)); 

}

Answer 3

Там есть идентификатор dblclick события на Prototype. Почему бы вам не использовать его?

observeSingleAndDoubleClick: function (element, singleClickHandler, doubleClickHandler) { 

    $(element).observe('click', function (event) { 
    singleClickHandler.call(this, event); 
    } 

    $(element).observe('dblclick', function (event) { 
    doubleClickHandler.call(this, event); 
    } 
}