Наведите курсор мыши / оставить проблему

Question

У меня есть span, который включает в себя якорь и span. Пример ниже

<span id="x"><a id="a_in" href="">link</a><span id="x_in">x</span></span>

Теперь я присоединяю событие mousenter / mouseleave к span с id="x". Когда я наводю курсор мыши на span id="x", он вызывает mousenter / mouseleave, это нормально. Проблема в том, что я mouseover span id="x_1" внутри родительского span mouseleave срабатывает.

Я хочу, чтобы mousenter / mouseleave запускался только тогда, когда я mouseenter или mouseleave родитель.

Есть идеи, как этого избежать?

Answer 1

короткий ответ: вы не можете избежать этого, но вы можете определить, что отпуск / ввод мышью происходит только на родительском

function mouseleaveOrEnterHandler(e){
   e = e || window.event;
   var target = e.target || e.which;
   if(target.id=='x') {
      //do something here
   }
}

Answer 2

Просто будьте конкретны, в каком событии вы хотите стрелять по какому элементу.Если вы используете jQuery: $("span#x").hover(function() { //action logic for mouse enter }, function() { //action logic for mouse leave });

Answer 3

ОК ... спасибо, ребята. Проба была на новом div, который я показывал на мышином центре, который перекрывал мой SPAN X и вызывал отпуск мыши.

Кроме того ...

MooTools имеет функции мыши и mouseleave, потому что mouseover / mouseout иногда просто не работает как ожидается. Mouseenter срабатывает только один раз вы вводите элемент и не стрелять снова, если ваша мышь пересекает дети элемента.

... так что почти все, что вы, ребята, предлагаете, и работает нормально. http://demos.mootools.net/Mouseenter

На всякий случай, если кто-то ищет способ остановить распространение с помощью mootools ...

$ ('myelement'). AddEvent ('click', function (e) { var event = e || window.event; if (event.stopPropagation) { event.stopPropagation (); } еще { event.cancelBubble = true; } });

Спасибо за помощь!

Answer 4

вам нужно cancelBubble() и stopPropagation().

Смотрите здесь: http://www.thedutchguy.com/article/javascript-prevent-event-bubbling-parent-child-when-fired.html

, а также здесь: http://www.openjs.com/articles/prevent_default_action/