2010-05-11 60 views
1

我創建了一個令人驚訝的工作腳本。 (我沒有做太多的JavaScript)JQuery Selector - 選擇它,不是嗎?

我所擁有的是在div中列出的圖像負載。這些圖像是隱藏的。 JQuery獲取圖像的屬性並將它們放入數組中。點擊正文後,頁面的背景圖像會發生變化。這很好地工作。

但是,我現在有一個問題。有幾個元素我不應該在點擊時改變背景。

即導航,頁腳和標題。我如何創建一個讓身體可點擊的選擇器,卻忽略了上面3個div的點擊?

我目前的選擇器,這是錯誤的。看起來像這樣。

$("body").click (function() { 

回答

2

利用.not()方法或:not()選擇器。例如:

使用不選擇:

$('*:not(#footer, #nav, #caption)').click(function(){ 
    // to change background. 
}); 

使用不()方法:

$('*').not('#footer, #nav, #caption').click(function(){ 
    // to change background. 
}); 
+3

記住事件冒泡,所以你需要去使用'stopPropagation'。您可能還想要移除這些元素的所有子項。 – Kobi 2010-05-11 08:56:43

+2

當然。 http://api.jquery.com/event.stopPropagation/ – sepehr 2010-05-11 09:02:45

1

給這個一展身手:

$("body *:not(div#navigation *, div#this *, div#that *)") 

收藏this page。理想情況下,您應該將所有應該「激活」的項目都包裝在容器div中。

1

爲例

$("body:not(#navigation,#footer,.caption)").css("background-color","red"); 

結賬documentation這個

1

,如果你只想要body,試試這個:

$('body').click(function(e){  
    if (e.target.nodeName.toLowerCase() != 'body') 
     return; 
    else 
     alert('Yeah! this is the body alright!') 
    }) 

$('body').click(function(e){  
    if (e.target.nodeName.toLowerCase() == 'body') 
     alert('Yeah! this is the body alright!') 
    }) 

快速demo
event.target