JavaScript: событие mouseenter в JavaScript?

Есть ли событие ввода мыши в javascript (только JavaScript, пожалуйста, не используйте jQuery)?

Когда я это делаю, он не дает ответа.

window.onload = initAll;
function initAll(){
    if(window.addEventListener){
        document.getElementById('container').addEventListener( 'mouseenter', freeze , false);
    }
}

function freeze(){
    console.log("mouse entered")    
}

Может ли кто-нибудь объяснить мне разницу между «mouseenter» и «mouseover»? Является ли «mouseover» альтернативой «mouseenter»?

Помощь приветствуется!


javascript mouseover mouseevent mouseenter
person Navneet Saini    schedule 23.05.2013    source источник
comment
Документы MDN, отличное место для изучения: mouseenter   -  person epascarello    schedule 23.05.2013
comment
stackoverflow.com/a/1104403/1053938   -  person jonhopkins    schedule 23.05.2013
comment
stackoverflow.com/questions/6130737/mouseenter-without-jquery   -  person Rachel Gallen    schedule 23.05.2013
comment
Здесь есть хорошее объяснение разницы между mouseenter и mouseover: api.jquery.com/mouseenter (примерно на полпути вниз)   -  person Rob Johnstone    schedule 23.05.2013
comment
Кстати, не забудьте вызвать свою функцию: window.onload = initAll(); (вам не хватает скобок)   -  person Petr Čihula    schedule 23.05.2013
comment
да неужели? Я не думаю, что нам нужны скобки там, чувак!   -  person Navneet Saini    schedule 23.05.2013
comment
В большинстве случаев вы можете эмулировать mouseenter IE, поместив этот код в свой обработчик mouseover... if (this !== event.target) { return } Это не охватывает все ситуации. Я думаю, что полное исправление может быть достигнуто довольно легко, но я точно не помню, как на макушке.   -  person    schedule 23.05.2013

Ответы (4)


arrow_upward
4
arrow_downward

Не беспокойтесь о onmouseenter, так как на на этой странице указано, что она специфична для IE.

... И onmouseenter, и onmouseover срабатывают, когда мышь входит в границу элемента. Однако onmouseenter не срабатывает снова (не всплывает), если мышь входит в дочерний элемент внутри этого первого элемента.

Попробуйте это для onmouseover:

yourObject.onmouseover=function()
    {
        //SomeJavaScriptCode
    };

Посетите эту страницу, чтобы найти полезную информацию о событиях мыши в javascript.

person gwin003    schedule 23.05.2013
comment
Итак, нельзя ли использовать «mouseenter» с другими браузерами? - person Navneet Saini; 23.05.2013
comment
Видимо не по тому посту. Я обычно использую onmouseover в любом случае. Вы можете использовать onmouseenter, если вы используете jQuery, согласно первому ответу в моей первой ссылке. api.jquery.com/mouseenter/ - person gwin003; 23.05.2013
comment
На этой странице говорится, что Firefox начал поддерживать onmouseenter в версии 10 (январь 2012 г.), а Chrome начал поддерживать его в версии 30 (октябрь 2013 г.) - person ChrisV; 10.12.2016

arrow_upward
0
arrow_downward

Определенно, Mouseover — это альтернатива mouseenter. Он дает контроль пользовательского интерфейса над любым элементом dom, к которому осуществляется доступ. обратитесь к этому для дальнейшего объяснения http://dean.edwards.name/weblog/2005/10/add-event/ mouseenter без JQuery

person aakashkrgoel    schedule 23.05.2013
comment
Но mouseover продолжает стрелять снова и снова? как это предотвратить? - person Navneet Saini; 23.05.2013
comment
вы можете написать обработчик для этого - person Rachel Gallen; 23.05.2013
comment
@RachelGallen Я не понимаю, о чем вы говорите .. Не могли бы вы дать мне ссылку на какой-нибудь урок/учебник? - person Navneet Saini; 23.05.2013
comment
в основном вы кодируете onmouseout одновременно... чтобы свести на нет onmouseover - person Rachel Gallen; 23.05.2013
comment
@RachelGallen Спасибо .. Это помогло - person Navneet Saini; 23.05.2013
comment
давайте продолжим это обсуждение в чате - person Navneet Saini; 23.05.2013

arrow_upward
0
arrow_downward

Если вы используете jQuery, используйте mouseenter и mouseleave вместо mouseover и mouseout.

введите здесь описание изображения

Если вы возьмете приведенный выше пример, все, что находится внутри границы, является элементом, давайте назовем тот, что слева, со словом «Имя» в нем #A. mouseenter будет срабатывать только при перемещении мыши внутри границы #A. mouseover, с другой стороны, будет срабатывать, когда вы входите в границу, снова, когда вы перемещаете указатель мыши за серый фон за «1», и снова, когда вы наводите указатель мыши на слово «Имя». Если вы хотите, чтобы событие срабатывало один раз, используйте mouseenter.

person Luke Madhanga    schedule 10.08.2014

arrow_upward
-2
arrow_downward

Наведение мыши используется, когда вы просто наводите курсор на что-то. Ввод с помощью мыши (или mousedown) должен использоваться при щелчке мышью. Полный список событий javascript можно найти здесь

person Rachel Gallen    schedule 23.05.2013
comment
Если вы прочитаете, что написано по ссылке, которую вы разместили, вы увидите, что mouseenter не имеет ничего общего с кликами. - person Rob Johnstone; 23.05.2013