Неожиданное поведение onmouseover с jQuery - PullRequest
Новая
       39

Неожиданное поведение onmouseover с jQuery

0 голосов
/ 05 октября 2009

У меня есть "onmouse over", даже привязанный к всем элементам страницы. Когда мышь находится над элементом, она рисует красную границу для ближайшего верхнего соответствующего элемента (например, попробуйте aardvark ).

У меня есть следующий код: 

<p>
<img height="333" width="250" title="Image par hyperbolic pants explosion sous licence CC - http://www.flickr.com/photos/74502564@N00/2716444681/" class="illustred" src="context-selector-test_files/rha_20090929_antivirus.jpg" />
Ah là là... ces abrutis qui continuent à refuser d'installer des antivirus parce que "
<em>
Je ne télécharge pas !
</em>
" ou "
<em>
Je ne vais que sur des sites de confiance.
</em>
</p>

Вы можете видеть, что "img" находится внутри "P".

Ожидаемое поведение: когда я перехожу через «P», оно становится граничным, затем, когда я перехожу к «IMG», граница переходит к «IMG».

Это не так.

Проблема не в CSS, потому что я не использую CSS, а 4 деления для имитации 4 границ в позиции «абсолют» вокруг элемента. Это обязательно для того, что будет дальше.

Проблема возникает, когда я перехожу на «IMG», «наведение мыши» действительно срабатывает, но сразу после того, как «наведение мыши» снова срабатывает на «Р». Я бы понял, что "P -> IMG", но "IMG -> P" вызывает меня. И почему, 2 мыши в одном ряду? Я не двигал мышью.

Теперь, чего мне не хватает?

Характеристики:

  • HTML 4;
  • css 2;
  • JQuery 1,3;
  • firefox 3.5;
  • Ubuntu 9.04;
  • кофе 1,50 (л).

Ответы [ 3 ]

1 голос
/ 05 октября 2009

Остановите распространение события в вашем обработчике мыши. 

$('selector').mouseover( function(e) {
    ...
    e.stopPropagation();
});

Вы также можете подумать об использовании метода hover () или плагина hoverIntent () . Последнее поможет уменьшить любое мигание, когда вы просто перетаскиваете мышь по странице, заставляя ждать по времени до вызова обработчика события.

1 голос
/ 05 октября 2009

Тебя ловит Event Bubbling.

Используйте mouseenter () вместо mouseover .

0 голосов
/ 05 октября 2009

Хорошо, я хочу покончить с собой, но вот ответ.

Я тупо забыл остановить распространение события. Вы вызываете функцию, которая вызывается при срабатывании onmouseover, должна, конечно, возвращать, выполнила ли она свою работу или нет. Верните false, если вы не хотите, чтобы событие всплывало выше.

Теперь, потратив 3 часа на эту тему, вы меня извините, я должен повеситься. Приветствия.

P.S: Я завещаю всех своих SO-представителей вики-сообщества.

...