Есть ли способ определить, находится ли кнопка мыши в данный момент в JavaScript?
Я знаю о событии "mousedown", но это не то, что мне нужно. Через некоторое время после нажатия кнопки мыши я хочу определить, нажата ли она по-прежнему.
Это возможно?
Ответы:
Что касается решения Pax: оно не работает, если пользователь нажимает более одной кнопки намеренно или случайно. Не спрашивайте меня, откуда я знаю :-(.
Правильный код должен быть таким:
С таким тестом:
Если вы хотите узнать, какая кнопка нажата, будьте готовы сделать mouseDown массивом счетчиков и посчитать их отдельно для отдельных кнопок:
Теперь вы можете проверить, какие кнопки были нажаты точно:
Теперь имейте в виду, что приведенный выше код будет работать только для браузеров, соответствующих стандарту, которые передают вам номер кнопки, начиная с 0 и выше. IE использует битовую маску нажатых в данный момент кнопок:
Так что скорректируйте свой код соответственно! Я оставляю это как упражнение.
И помните: IE использует глобальный объект события, называемый… «событие».
Между прочим, в IE есть функция, полезная в вашем случае: когда другие браузеры отправляют «кнопку» только для событий кнопки мыши (onclick, onmousedown и onmouseup), IE также отправляет ее с помощью onmousemove. Таким образом, вы можете начать прослушивание onmousemove, когда вам нужно узнать состояние кнопки, и проверить evt.button, как только вы его получили - теперь вы знаете, какие кнопки мыши были нажаты:
Конечно, вы ничего не получите, если она играет мертвой и не двигается.
Соответствующие ссылки:
Обновление № 1 : я не знаю, почему я перенес код в стиле document.body. Будет лучше прикрепить обработчики событий непосредственно к документу.
источник
event.buttons
к любому используемому вами триггеру события без внешних сохраненных переменных. Я задал совершенно новый вопрос (потому что мое мышиное событие не всегда срабатывает, поэтому это решение не работает для меня) и получил этот ответ за 5 минут.Это старый вопрос, и ответы здесь, по-видимому, в основном требуют использования
mousedown
иmouseup
отслеживания нажатия кнопки. Но, как уже отмечали другие,mouseup
срабатывает только при выполнении в браузере, что может привести к потере контроля над состоянием кнопки.Однако MouseEvent (сейчас) указывает, какие кнопки нажимаются в данный момент:
MouseEvent.buttons
MouseEvent.which
(buttons
будет неопределенным для Safari). Примечание.which
Используются разные числаbuttons
для щелчков правой и средней кнопки.Когда зарегистрировано
document
,mousemove
будет срабатывать сразу же , как только курсор залез браузер, так что если пользователь отпускает снаружи , то состояние будет обновляться , как только они мышь обратно внутрь.Простая реализация может выглядеть так:
Если требуются более сложные сценарии (разные кнопки / несколько кнопок / клавиши управления), ознакомьтесь с документами MouseEvent. Когда / если Safari отменяет свою игру, это должно стать проще.
источник
e.buttons
будет1+2=3
, поэтомуe.buttons === 1
будет ложным). Если вы хотите проверить, не нажата ли основная кнопка, но не заботитесь о других состояниях кнопок, сделайте следующее:(e.buttons & 1) === 1
MouseEvent.buttons
, кажется, это7
означает, что он думает, что кнопки Primary, Secondary и Auxilary все нажаты вместе. Я не уверен, почему это так - вы используете продвинутую мышь? Если так, возможно, стоит попробовать базовый. Если вам нужно только запустить его, вы можете использовать побитовую проверку, чтобы убедиться, что левая кнопка нажата, и игнорировать любые другие. например.MouseEvent.buttons & 1 === 1
,Я думаю, что лучший подход к этому состоит в том, чтобы вести собственную запись состояния кнопки мыши следующим образом:
а потом, позже, в вашем коде:
источник
решение не хорошее. можно «навести» на документ, затем «навести курсор мыши» за пределы браузера, и в этом случае браузер все еще будет думать, что мышь не работает.
Единственное хорошее решение - использовать объект IE.event.
источник
Я знаю, что это старый пост, но я подумал, что отслеживание нажатия кнопки мыши с помощью мыши вверх / вниз показалось мне немного неуклюжим, поэтому я нашел альтернативу, которая может понравиться некоторым.
Селектор: active обрабатывает щелчок мыши намного лучше, чем мышь вверх / вниз, вам просто нужен способ чтения этого состояния в событии onmousemove. Для этого мне нужно было обмануть и полагаться на то, что курсором по умолчанию является «авто», и я просто изменяю его на «по умолчанию», то есть то, что автоматически выбирает по умолчанию.
В объекте вы можете использовать все, что возвращает getComputedStyle, которое вы можете использовать в качестве флага, не нарушая внешний вид вашей страницы, например, border-color.
Мне бы хотелось установить свой собственный стиль в разделе: active, но я не смог заставить его работать. Было бы лучше, если это возможно.
источник
Следующий фрагмент попытается выполнить функцию doStuff через 2 секунды после события mouseDown в document.body. Если пользователь поднимает кнопку, происходит событие mouseUp и отменяется отложенное выполнение.
Я бы посоветовал использовать какой-либо метод для прикрепления кросс-браузерного события - явная установка свойств mousedown и mouseup была сделана для упрощения примера.
источник
Коротко и сладко
Я не уверен, почему ни один из предыдущих ответов не работал для меня, но я придумал это решение в момент эврики. Это не только работает, но и наиболее элегантно:
Добавить к тегу тела:
Затем проверьте и выполните,
myfunction()
еслиdown
равно1
:источник
Вы можете объединить @Pax и мои ответы, чтобы также получить время, в течение которого мышь не работала:
Тогда позже:
источник
Вам нужно обработать MouseDown и MouseUp и установить какой-нибудь флаг или что-то такое, чтобы отслеживать его «позже в будущем» ... :(
источник
Если вы работаете на сложной странице с существующими обработчиками событий мыши, я бы порекомендовал обрабатывать событие при захвате (вместо пузыря). Для этого просто установите 3-й параметр
addEventListener
вtrue
.Кроме того, вы можете проверить,
event.which
чтобы убедиться, что вы обрабатываете фактическое взаимодействие с пользователем, а не события мыши, напримерelem.dispatchEvent(new Event('mousedown'))
.Добавьте обработчик к документу (или окну) вместо document.body важно, потому что он гарантирует, что события mouseup за пределами окна по-прежнему записываются.
источник
Используя API MouseEvent , чтобы проверить нажатую кнопку, если есть:
Возвращение :
источник
Используя jQuery, следующее решение обрабатывает даже «перетащить страницу, а затем освободить регистр».
Я не знаю, как он обрабатывает несколько кнопок мыши. Если бы был способ запустить щелчок за пределами окна, а затем ввести мышь в окно, то это, вероятно, также не будет работать должным образом.
источник
Ниже приведен пример jQuery, когда мышь находится над $ ('. Element'), цвет меняется в зависимости от того, какая кнопка мыши нажата.
источник
Как сказал @Jack, когда
mouseup
происходит за пределами окна браузера, мы не знаем об этом ...Этот код (почти) работал для меня:
К сожалению, я не получу
mouseup
событие в одном из этих случаев:источник
Ну, вы не можете проверить, не горит ли он после события, но вы можете проверить, горит ли он ... Если он горит ... это означает, что больше не гаснет: P lol
Таким образом, пользователь нажимает кнопку вниз (событие onMouseDown) ... и после этого вы проверяете, активен ли он (onMouseUp). Пока это не так, вы можете делать то, что вам нужно.
источник
эта кросс-браузерная версия отлично работает для меня.
источник