jquery - 如何選擇元素和所有的孩子，除了特定的孩子

我有一個.mouseover（）事件觸發類節點的所有元素。它工作正常，並且在用戶懸停在.node的任何子節點時也會觸發。這對我來說很好，但是，如果用戶鼠標移過特定的子項，即圖像，我不希望觸發此事件。jquery - 如何選擇元素和所有的孩子，除了特定的孩子

爲什麼選擇器$（'。node：not（img）'） not working？

奇怪的是，當我在http://www.woods.iki.fi/interactive-jquery-tester.html上嘗試時，它確實有效，但在我的實際實現中並沒有。

我的HTML：

<div id="container"> 
      <div class="node" id="abc"> 
      <h2>Node Title</h2> 
      <div class="nodeChildren"> 
        <h3 id="a1">Some text</h3> 
        <h3 id="a2">Some text</h3> 
        <h3 id="a3">Some text</h3> 
      </div> 
      <img src="diagonal-left.gif" /> 
      </div> 
    </div>

我的jQuery：

//start with third tier not visible 
    $('.nodeChildren').hide(); 

    $('.node :not(img)').mouseover(function(){ 
      $(this).children('div').show(); 
    }); 

    $('.node').mouseout(function() { 
      $('.nodeChildren').hide(); 
    });

}）;

我的失敗是「冒泡」上升到了觸發鼠標父母嘗試

$('.node :not(img)') //no mouseover is triggered 

//for the following selectors, the mouseover event is still triggered on img 
$('.node').not('img') 
$('.node').not($('.node').children('img'))

感謝所有幫助:)

來源

2010-07-09 sycamore

的問題是該事件。你需要添加一個mouseover到img來停止這個。

$(".node img").bind("mouseover", function(event) { 
    event.stopPropagation(); 
});

來源

2010-07-09 03:50:18

在bind的回調函數中，可以檢查目標。在你的情況下，像這樣的東西

$(".node").bind('mouseover',function(e){ 

    if(e.target.nodeName != 'IMG'){ 
     $(this).children('div').show(); 
    } 

});

來源

2010-07-09 04:00:57 naiquevin

jquery - 如何選擇元素和所有的孩子，除了特定的孩子

回答

相關問題