Дифференцировать клик против mousedown/mouseup
Я прочитал несколько ответов на stackoverflow, относящихся к этой ситуации, но ни одно из решений не работает.
Я пытаюсь сделать разные вещи, основываясь на том, нажимает ли пользователь элемент или удерживает мышь на этом элементе с помощью jQuery.
Можно ли выполнить это?
Ответы
Ответ 1
Здесь один подход
- установить переменную в true
- создать функцию, которая будет устанавливать ее в false при вызове
- иметь таймер (
setTimeout()
) начать отсчет времени на mousedown()
- в mouseup, очистите таймаут и проверьте, истинна ли эта переменная или false.
- Если это ложь, вызовите функцию, которую вы хотите выполнить, нажав
- В любом случае установите для переменной значение true
Это сделает то, что вы хотите.
Здесь jsfiddle показывает, как это может работать: http://jsfiddle.net/zRr4s/3/
Ответ 2
onMouseDown будет срабатывать при нажатии левой или правой (или средней). Аналогично, onMouseUp будет запускаться при отпускании любой кнопки. onMouseDown будет срабатывать даже тогда, когда мышь будет нажата на объект, а затем отодвинется от него, а onMouseUp будет запускаться, если вы нажмете и удерживаете кнопку в другом месте, затем отпустите ее над объектом.
onClick запускается только при нажатии левой кнопки мыши и отпускании на том же объекте. В случае, если вы заботитесь о порядке, если на одном и том же объекте установлены все 3 события, это onMouseDown, onMouseUp, а затем onClick. Каждый из них должен запускать только один раз.
Подробнее:
Ответ 3
Здесь решение, которое поддерживает как клики, так и тэги:
// Timeout, started on mousedown, triggers the beginning of a hold
var holdStarter = null;
// Milliseconds to wait before recognizing a hold
var holdDelay = 500;
// Indicates the user is currently holding the mouse down
var holdActive = false;
// MouseDown
function onMouseDown(){
// Do not take any immediate action - just set the holdStarter
// to wait for the predetermined delay, and then begin a hold
holdStarter = setTimeout(function() {
holdStarter = null;
holdActive = true;
// begin hold-only operation here, if desired
}, holdDelay);
}
// MouseUp
function onMouseUp(){
// If the mouse is released immediately (i.e., a click), before the
// holdStarter runs, then cancel the holdStarter and do the click
if (holdStarter) {
clearTimeout(holdStarter);
// run click-only operation here
}
// Otherwise, if the mouse was being held, end the hold
else if (holdActive) {
holdActive = false;
// end hold-only operation here, if desired
}
}
// Optional add-on: if mouse moves out, then release hold
function onMouseOut(){
onMouseUp();
}
Вот демо: http://jsfiddle.net/M7hT8/1/
Первоначально на основе решения daveyfaherty.
Я знаю, что этот вопрос давно, но я делюсь своим решением для тех, кто находит это через поиск.
Ответ 4
//last mouse coordinate
var mouseX = 0;
//epsilon interval
var mouseEps = 10;
function mouseDownHandler(e) {
e.preventDefault();
mouseX = e.clientX;
};
function mouseUpHandler(e) {
e.preventDefault();
if (Math.abs((mouseX - e.clientX)) < mouseEps) {
clickHandler(e);
}
};
function clickHandler(e) {
};