Почему этот код не работает в Firefox? - PullRequest
0 голосов
/ 23 октября 2011

Я пытаюсь предотвратить запуск события onmouseout, когда мышь перемещается из внешнего элемента div в один из дочерних элементов контейнера.Вот решение, которое я придумал.Он работает в IE8 и Chrome, но не в Firefox (последняя версия).Это потому, что в функции Foo window.event имеет значение null.Я также проверил, что в функцию не передаются аргументы.Как мне заставить этот код работать в Firefox?

<html>
<body>

<div style="background-color: blue; width: 400px; height: 400px;" onmouseout="Foo()" id="Outer">
   <div style="background-color: green; width: 100px; height: 100px;" id="Inner">
      Child element
   </div>
</div>

<script language="JavaScript">
   var outer = document.getElementById('Outer');

   function Foo()
   {
      var toElem = event.relatedTarget || event.toElement;

      if(toElem != outer.parentNode)
         return;

      window.alert('Outer div fired onmouseout..');
   }
</script>

</body>
</html>

Ответы [ 2 ]

6 голосов
/ 23 октября 2011

На первый взгляд кажется, что ваш код должен нормально работать в IE, но в других браузерах может возникнуть проблема с использованием свойства toElement объекта события, которое является свойством IE.Определяемое W3C свойство называется relatedTarget.Поэтому вам, вероятно, следует проверить, какой из них использовать:

var toElem = event.relatedTarget || event.toElement;
if(toElem != outer.parentNode) {
   //Do stuff
}

Примечание. На самом деле я не пробовал ваш код во всех браузерах, так что могут возникнуть другие проблемы, но эта проблема возниклана меня.

2 голосов
/ 23 октября 2011

Я понял это. Этот код работает в IE, Firefox и Chrome.

<html>
<body>

<div style="background-color: blue; width: 400px; height: 400px;" id="Outer">
   <div style="background-color: green; width: 100px; height: 100px;" id="Inner">
      Child element
   </div>
</div>

<script language="JavaScript">
   var outer = document.getElementById('Outer');

   outer.onmouseout = function Foo(args)
   {
      var toElem = (window.event) ? (event.relatedTarget || event.toElement) : args.relatedTarget;

      if(toElem != outer.parentNode)
         return;

      window.alert('Outer div fired onmouseout..');
   }
</script>

</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...