Как вы получаете нажатие кнопки мыши с помощью jQuery?
$('div').bind('click', function(){
alert('clicked');
});
это вызывается как правым, так и левым щелчком, как можно поймать правый щелчок мыши? Я был бы счастлив, если бы существовало что-то вроде ниже:
$('div').bind('rightclick', function(){
alert('right mouse button is pressed');
});
contextmenu
является родным для браузера. в нативном JavaScript вы можете прикрепить кoncontextmenu
событию.Изменить : я изменил его для работы с динамически добавленными элементами, используя
.on()
в JQuery 1.7 или выше:Демо: jsfiddle.net/Kn9s7/5
[Начало оригинального сообщения] Вот что сработало для меня:
Если у вас есть несколько решений ^^
Редактировать : Тим Даун поднимает хороший вопрос, что это не всегда будет событие,
right-click
которое запускаетcontextmenu
событие, но также и при нажатии клавиши контекстного меню (что, возможно, является заменой дляright-click
)источник
contextmenu
запуск события не всегда подразумевает, что была нажата правая кнопка мыши. Правильный подход - получить информацию о кнопке из события мыши (click
в данном случае).Вы можете легко определить, какая кнопка мыши была нажата, проверив
which
свойство объекта события на событиях мыши:источник
e.button==2
Вместо этого используется плагин jQuery, указанный выше .event.button
кроссбраузера - более сложная задача, чемevent.which
цифры, используемые для кнопокevent.button
. Посмотрите на эту статью с января 2009 года - unixpapa.com/js/mouse.htmlmouseup
убедиться, что человек действительно нажал на элемент? Часто, если я случайно щелкаю что-то, я могу предотвратить щелчок, удерживая кнопку мыши и перетаскивая за пределы элемента.mouseup
, вероятно, является лучшим событием, это всего лишь пример использованияevent.which
нажатий кнопок мышиВы также
bind
можетеcontextmenu
иreturn false
:Демо: http://jsfiddle.net/maniator/WS9S2/
Или вы можете сделать быстрый плагин, который делает то же самое:
Демо: http://jsfiddle.net/maniator/WS9S2/2/
Используя
.on(...)
jQuery> = 1.7:Демо: http://jsfiddle.net/maniator/WS9S2/283/
источник
method.call(this, e);
вместоmethod();
This way,method
получает правильное значениеthis
и также правильно передает объект события ему.Обновление для текущего состояния вещей:
источник
event.which
был введен, что устраняет кросс-браузерную совместимость.http://jsfiddle.net/SRX3y/8/
источник
Есть много очень хороших ответов, но я просто хочу коснуться одного существенного различия между IE9 и IE <9 при использовании
event.button
.Согласно старой спецификации Microsoft для
event.button
кодов отличаются от тех, которые используются W3C. W3C рассматривает только 3 случая:event.button === 1
event.button === 3
event.button === 2
В старых Internet Explorer, однако, Microsoft немного переключается на нажатую кнопку, и есть 8 случаев:
event.button === 0
или 000event.button === 1
или 001event.button === 2
или 010event.button === 3
или 011event.button === 4
или 100event.button === 5
или 101event.button === 6
или 110event.button === 7
или 111Несмотря на то, что это теоретически так и должно работать, ни один Internet Explorer никогда не поддерживал случаи одновременного нажатия двух или трех кнопок. Я упоминаю об этом, потому что стандарт W3C даже теоретически не может это поддержать.
источник
event.button === 0
что не нажата кнопка, блестящий IEಠ_ಠ
Мне кажется, что небольшая адаптация ответа TheVillageIdiot будет чище:
РЕДАКТИРОВАТЬ: JQuery предоставляет
e.which
атрибут, возвращая 1, 2, 3 для левого, среднего и правого щелчка соответственно. Таким образом, вы также можете использоватьif (e.which == 3) { alert("right click"); }
Смотрите также: ответы на «Запуск события onclick с помощью среднего щелчка»
источник
event.which === 1
обеспечивает щелчок левой кнопкой мыши (при использовании jQuery).Но вы также должны подумать о клавишах-модификаторах: ctrlcmdshiftalt
Если вы заинтересованы только в ловле простых неизмененных левых кликов, вы можете сделать что-то вроде этого:
источник
Если вы ищете "Лучшие события мыши Javascript", которые позволяют
Посмотрите на этот кросс-браузерный обычный javascript, который запускает вышеописанные события и удаляет головную боль. Просто скопируйте и вставьте его в заголовок вашего скрипта или включите в файл
<head>
документа. Затем свяжите ваши события, обратитесь к следующему блоку кода ниже, который показывает пример jquery для захвата событий и запуска назначенных им функций, хотя это работает и с обычным связыванием javascript.Если вам интересно посмотреть, как это работает, взгляните на jsFiddle: https://jsfiddle.net/BNefn/
Пример улучшенных событий щелчка мышью (для простоты используется jquery, но приведенный выше будет работать в разных браузерах и запускать те же имена событий, которые использует IE перед именами)
А для тех, кто нуждается в минимизированной версии ...
источник
источник
источник
С JQuery вы можете использовать
event object type
источник
Есть также способ сделать это без JQuery!
проверить это:
источник
источник
Для тех , кто задается вопросом, должны ли они или не использовать
event.which
в ванильным JS или угловому : Это теперь осуждается так предпочитают использоватьevent.buttons
вместо этого.Примечание. С помощью этого метода и события (mousedown) :
Событие and (mouseup) НЕ возвращает те же числа, но 0 вместо этого.
Источник: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons
источник
источник