JQuery: Обнаружение нажатия кнопки мыши во время MouseMove события

Я пытался обнаружить, какая кнопка мыши -если any- является пользователь, нажав во время MouseMove события под JQuery, но я получаю неоднозначные результаты:JQuery: Обнаружение нажатия кнопки мыши во время MouseMove события

no button pressed:  e.which = 1 e.button = 0 
left button pressed: e.which = 1 e.button = 0 
middle button pressed: e.which = 2 e.button = 1 
right button pressed: e.which = 3 e.button = 2

код :

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
</head> 
<body> 

<input id="whichkey" value="type something"> 
<div id="log"></div> 
<script>$('#whichkey').bind('mousemove',function(e){ 
    $('#log').html(e.which + ' : ' + e.button); 
}); </script> 

</body> 
</html>

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

источник

2010-11-01 Sebastián Grignoli

Пожалуйста, объясните, что вы пытаетесь сделать лучше. Если mouseenter тогда mousedown тогда mouseup, то mouseexit не приводит к кнопке? Как насчет mousedown, затем mouseenter, затем mouseexit, затем mouseup? Вы спрашиваете, записывается ли муссомова на вход, что ни одна кнопка не была нажата? – Fresheyeball

Я пытаюсь выделить текст на странице. Каждое слово находится в своем собственном промежутке. Mouseover + левая кнопка над элементом span должна выделить его, mouseover + правая кнопка должна осветить его. –

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

Чтобы отслеживать состояние LMB, привяжите событие к уровню документа для mousedown и mouseup и установите флажок для e.which, чтобы установить или удалить флаг.

Предварительная обработка выполняется функцией tweakMouseMoveEvent() в моем коде. Чтобы поддерживать версии IE < 9, вы должны проверить, были ли кнопки мыши выпущены за пределами окна и очистить флаг, если это так. Затем вы можете изменить переданную переменную события. Если e.which изначально был 1 (без кнопки или LMB), и текущее состояние левой кнопки не было нажато, просто установите e.which на 0 и используйте это в остальной части вашего mousemove, чтобы проверить, нет ли нажатых кнопок.

Обработчик mousemove в моем примере просто вызывает функцию tweak, передающую текущую переменную события, затем выводит значение e.which.

$(function() { 
    var leftButtonDown = false; 
    $(document).mousedown(function(e){ 
     // Left mouse button was pressed, set flag 
     if(e.which === 1) leftButtonDown = true; 
    }); 
    $(document).mouseup(function(e){ 
     // Left mouse button was released, clear flag 
     if(e.which === 1) leftButtonDown = false; 
    }); 

    function tweakMouseMoveEvent(e){ 
     // Check from jQuery UI for IE versions < 9 
     if ($.browser.msie && !e.button && !(document.documentMode >= 9)) { 
      leftButtonDown = false; 
     } 

     // If left button is not set, set which to 0 
     // This indicates no buttons pressed 
     if(e.which === 1 && !leftButtonDown) e.which = 0; 
    } 

    $(document).mousemove(function(e) { 
     // Call the tweak function to check for LMB and set correct e.which 
     tweakMouseMoveEvent(e); 

     $('body').text('which: ' + e.which); 
    }); 
});

Попробуйте демо здесь: http://jsfiddle.net/G5Xr2/

источник

2011-05-30 21:15:34 DarthJDG

Спасибо, я не мог понять, почему всегда было 0 в IE. –

хорошее решение. как насчет того, если на дочернем элементе есть событие mousedown? будет ли упущенное событие документа? –

забудьте об этом ... я протестировал, и он работает как шарм. –

jQuery нормализует значение which, поэтому он будет работать во всех браузерах. Бьюсь об заклад, если вы запустите свой скрипт, вы найдете разные значения e.button.

источник

2010-11-01 01:14:06 Mottie

Вот что я подумал. К сожалению, 'which' не говорит мне, нажата ли левая кнопка или нет. –

Я думаю, что некоторые события не обрабатывают данные кнопок как другие, попробуйте добавить глобальную переменную и изменить ее значение с помощью события «mousedown». – Mottie

Демо-версия: http://jsfiddle.net/Mottie/ubgLA/ – Mottie

Эти переменные обновляются, когда происходит событие mousedown (среди других); вы видите значение, которое остается от этого события. Обратите внимание, что they are properties of that event, а не самой мыши:

Описание: Для ключа или кнопки событий, этот атрибут указывает на определенную кнопку или клавишу, которая была нажата.

Нет значения для «без нажатия кнопки», потому что событие mousedown никогда не загорается, указывая на то, что кнопки не нажата.

Вам нужно будет сохранить свою собственную глобальную переменную [boolean] и включить/выключить ее на mousedown/mouseup.

Это будет работать только тогда, когда окно браузера было фокус, когда кнопка была нажата, а это значит, фокус-переключатель между пользователем нажатием кнопки мыши и ваш mousemove обжига событий предотвратят это работать должным образом. Тем не менее, вы действительно ничего не можете с этим поделать.

источник

2011-05-28 01:20:55

По какой-то причине, когда привязка к mousemove случае, свойство event.which устанавливается в 1, если левая кнопка или нет нажата.

я изменил mousedown событие, и она работала Ok:

слева: 1
средний: 2
право: 3

Вот рабочий пример: http://jsfiddle.net/marcosfromero/RrXbX/

Код jQuery:

$('p').mousedown(function(event) { 
    console.log(event.which); 
    $('#button').text(event.which); 
});

источник

2011-06-01 02:46:32 marcosfromero

Большинство браузеров (except Safari) *) теперь поддерживают MouseEvent.buttons свойство (примечание: во множественном числе "кнопку сек"), которая 1 при нажатии левой кнопки мыши:

$('#whichkey').bind('mousemove', function(e) { 
    $('#log').html('Pressed: ' + e.buttons); 
});

https://jsfiddle.net/pdz2nzon/2

*) мир движется вперед:
https://webkit.org/blog/8016/release-notes-for-safari-technology-preview-43/
https://trac.webkit.org/changeset/223264/webkit/

источник

2016-02-18 12:59:43 Sphinxxx

Этот ответ должен быть принят! Браузеры от ленивых продавцов могут получить помощь от: https://github.com/mikolalysenko/mouse-event – yckart

Пришел, чтобы добавить этот ответ, потому что другие не работают. Согласитесь, это должен быть принят ответ. – BoB3K

По состоянию на сегодняшний день следующие работы на Firefox 47, Chrome 54 и Safari 10.

$('#whichkey').bind('mousemove',function(e){ 
    if (e.buttons & 1 || (e.buttons === undefined && e.which == 1)) { 
     $('#log').html('left button pressed'); 
    } else if (e.buttons & 2 || (e.buttons === undefined && e.which == 3)) { 
     $('#log').html('right button pressed'); 
    } else { 
     $('#log').html('no button pressed'); 
    } 
});

источник

2016-11-20 14:04:52

Для пользователей, которые ищут подобное решение, но без использования JQuery, вот способ как я решил свою проблему:

Надеюсь, это полезно для кого-то, кто ищет ответ.

источник

2017-05-14 22:25:46

JQuery: Обнаружение нажатия кнопки мыши во время MouseMove события

ответ

Смежные вопросы