остановить JQuery в прямом эфире от зацепления всех детей

Question

Я не могу удержать глупую вещь от запуска события при наведении курсора на детей предмета.Я хочу, чтобы событие запускалось только через элемент div.item, а не div.itemChild.Это сводит меня с ума, пожалуйста, помогите.

event.stopPropigation не работает.и if(!$(event.source).is('itemChild')), по какой-то причине is() всегда возвращает false.

HTML

<div id="items">
    <div class="item">
        <div class="itemChild">
        </div>
        <div class="itemChild">
        </div>
    </div>
</div>

JS

//on hover event for each post
$('div.item', '#items').live('mouseover mouseout', function(event){
    if (event.type == 'mouseover'){
        //fire mouseover handler
    }
    else{
        //fire mouseout handler
    }
});

Есть ли какой-нибудь способ остановить живую стрельбу, когда парят дети div.item?

Кстати, дети div.item полностью это закрывают.

В основном я хочуэто действует как .hover (), но привязывается к вещам, загруженным через ajax.

Answer 1

Это не обязательно для детей. Это пузырится до родителя.

Кроме того, ваш синтаксис неверен. Это:

$("div.item", "div.items")...

говорит "найди мне все элементы div с элементом класса, которые являются потомками элементов div с классом элементов. Но у вас нет таких элементов div (с элементами класса). У вас есть элемент div с идентификатором элементов.

Объединяя все это, попробуйте:

$("#items div").live("mouseover mouseout", function(event) {
  if ($(event.source).hasClass("itemChild")) {
    return false;
  } else if (event.type == "mouseover") {
    ...
  } else {
    ...
  }
});

Или, альтернативно:

$("#items > div.item").live("mouseover mouseout", function(event) {
  if (!($this).is("div.item")) {
    return false;
  }
  ...
});

По сути, существует множество способов обрезать эту кошку, но, как я сказал в первом предложении, вы должны понимать, что события всплывают, пока обработчики не прекратят распространение, либо напрямую (вызывая event.stopPropagation() или возвращая false из обработчика событий, что эквивалентно event.stopPropagation(); event.preventDefault();).

Кроме того, если вы делаете mouseenter и mouseout, вы также можете просто использовать событие hover(), которое выполняет оба из них:

$("#items > div.item").live("hover", function(event) {
  // mouseenter
}, function(event) {
  // mouseout
});