Mousemove и кросс-браузер e.which
Мне нужно знать, какая клавиша мыши нажата на каждое событие mousemove, и я пытаюсь использовать это:
getMouseCode: function(e) {
e = e || window.event;
if (!e.which && e.button) {
if (e.button & 1) e.which = 1;
else if (e.button & 4) e.which = 2;
else if (e.button & 2) e.which = 3;
};
return e.which;
},
Но это работает только в хром и IE7-8. Отладчик IE9 всегда говорит e.button == 0 и e.which == 1. После некоторой отладки я понял, что window.event для IE9 содержит правильное значение, поэтому я поменялся
e = window.event || e;
Это также делает трюк для Safari и Air, но Firefox имеет window.event undefined, а Opera имеет те же самые неправильные значения как в аргументе обратного вызова, так и в объектах window.event.
Ответы
Ответ 1
Я рассматривал этот вопрос при исследовании связанной проблемы. Оказалось, что моя проблема в том, что мне нужно было использовать отдельные функции для обработки событий onclick
и onmouseover
.
Я обнаружил, что при использовании Opera, Safari и FireFox свойство "which" объекта события mousemove устанавливается равным 1, когда не была нажата кнопка мыши.
Ответ 2
Хотя этот ответ может быть довольно поздним, я уверен, что это поможет тем, кто в будущем. Я наткнулся на этот вопрос, ища эту функцию перекрестного браузера и изначально проигнорировал ее. Я вернусь, чтобы дать свой ответ тем, которые следуют по моим стопам.
Во-первых, некоторые знания. Я нашел этот сайт очень полезным, так как все проблемы с перекрестным браузером (и большинство из них) разработаны и рассчитаны на ваше развлечение (я смеюсь, когда разработчикам необходимо создавать диаграммы и диаграммы для работы браузеров.)
http://unixpapa.com/js/mouse.html
На этой странице, расположенной внизу, вы найдете синюю ссылку, в которой говорится: "Нажмите здесь, используя различные кнопки мыши, чтобы проверить", над этим вы увидите фрагмент кода. Это входит в ваш mousedown или mouseup. Если вы щелкните правой кнопкой мыши и просмотрите источник в этом месте, вы найдете тег script, который содержит 2 функции, одну выше этой ссылки и функцию 'dont', которая предотвращает выполнение событиями по умолчанию или проваливается, хотя и не требуется во всех случаях, полезно знать.
Вторая часть знаний поступает с другого веб-сайта и дает нам некоторое представление о том, как захватывать события мыши и мыши.
http://www.javascriptkit.com/javatutors/onmousewheel.shtml
Чтобы собрать все это в одном месте, мы имеем в основном следующее.
function GetMouseButton(e) {
// Normalize event variable
var e = window.event || e;
// Set button to initially not recognized (or false if you need to to be)
var button = 'Not Recognized';
// Check if this is a button push event
if(e.type == 'mousedown' || e.type == 'mouseup') {
if (e.which == null) {
// Check if IE, if so, what e.button was pressed
button = (e.button < 2) ? "Left" :
((e.button == 4) ? "Middle" : "Right");
} else {
// All other browsers, what e.which was pressed
button = (e.which < 2) ? "Left" :
((e.which == 2) ? "Middle" : "Right");
}
} else {
// If this is not a button push event, then we get the direction
var direction = e.detail ? e.detail * (-120) : e.wheelDelta;
// And name the direction as a 'button'
switch(direction) {
case 120: // Browsers use different variants of these
case 240:
case 360:
button = "Middle Scroll Up";
break;
case -120:
case -240:
case -360:
button = "Middle Scroll Down";
break;
}
}
alert(button);
}
/* Simple Bind function (like jQuery for example) */
function Bind(elem, type, eventHandle) {
if (elem == null || elem == undefined) return;
if ( elem.addEventListener ) {
elem.addEventListener( type, eventHandle, false );
} else if ( elem.attachEvent ) {
elem.attachEvent( "on" + type, eventHandle );
} else {
elem["on"+type]=eventHandle;
}
}
/* Bind your mousedown / mouseup to the window, as well as the mousewheel */
Bind(window, 'mousedown', GetMouseButton);
Bind(window, 'mouseup', GetMouseButton);
/* One of FireFox browser versions doesn't recognize mousewheel,
* we account for that in this line
*/
var MouseWheelEvent =
(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel";
Bind(window, MouseWheelEvent, GetMouseButton);
Чтобы сэкономить некоторое время [и знания, если вы не смотрите на эти ссылки], вы можете просмотреть рабочий пример в следующем jsfiddle:
http://jsfiddle.net/BNefn/
ИЗМЕНИТЬ
Я должен был также сказать, что, поскольку вам нужно знать это на каждом событии mousemove, вы можете просто сохранить итоговую кнопку "имя" и тип события (вниз или вверх), а затем вспомнить эту информацию о переменных во время события mousemove. Если у вас есть переменная для каждой из этих "кнопок", вы можете увидеть, какая кнопка нажата, а какая нет, и очистить переменные, которые нажимаются на мышку.