selektor jQuery: Nie ten div, a nie ten div - jquery, css, kliknij

Próbuję utworzyć funkcję kliknięcia jQueryktóry zamknie div, gdy klikniesz na cokolwiek poza tym div. Mój problem polega na tym, że w polu div znajduje się pole wyszukiwania i inny przycisk, który musi pozostać otwarty, jeśli klikniesz je.

Moja obecna funkcja to:

$("*:not(#header)").click(function() {
$("#header").slideUp({
duration: 550,
easing: "easeOutExpo"
});
});

Chcę również powiedzieć „i nie jest” #categoryMore ”i nie jest to„ #headerSearch ””, ale używana przeze mnie składnia nie działa.

$("*:not(#header, #categoryMore, #headerSearch)")

i

$("*:not(#header), *:not(#categoryMore), *:not(#headerSearch)")

Jakieś pomysły? Wielkie dzięki za Twoją pomoc!

Odpowiedzi:

3 dla odpowiedzi № 1

EDYTOWAĆ:

Oto przykład, który możesz przetestować. http://jsfiddle.net/yvFcz/

użyłem slideToggle() na przykład, dzięki czemu można łatwiej przetestować go więcej niż raz.

---

Umieść moduł obsługi w document to się zamyka #header.

Następnie umieść moduł obsługi #header to robi event.stopPropagation() aby zapobiec pojawieniu się zdarzenia w dokumencie po kliknięciu w nim dokumentu.

$(document).click(function() {
$("#header:visible").slideUp({
duration: 550,
easing: "easeOutExpo"
});
});

$("#header").click(function( event ) {
event.stopPropagation();
});

• http://api.jquery.com/event.stopPropagation

Pamiętaj, że jeśli jakikolwiek inny element na stronie ma moduł obsługi kliknięć, który używa event.stopPropagation() lub return false;, wydarzenie nie będzie „bańkowane” do dokumentu, a twoje #header nie zamknie się.

W takim przypadku musisz obsłużyć go bezpośrednio w tym module obsługi.

---

1 dla odpowiedzi nr 2

Istnieje wtyczka jQuery jQuery outside events możesz użyć:

Dzięki jQuery poza wydarzeniami możesz powiązać zwydarzenie, które będzie uruchamiane tylko, gdy określony Zdarzenie „inicjujące” ma miejsce na zewnątrz dany element. Na przykład, możesz kliknąć na zewnątrz, dwukrotnie kliknąć na zewnątrz, najechanie myszką na zewnątrz, skupienie na zewnątrz (i ponad dziesięć innych domyślnych Zdarzenia „zewnętrzne”). Ponadto, jeśli na zewnątrz wydarzenie nie zostało dostarczone domyślnie, możesz łatwo zdefiniować własne.

---

1 dla odpowiedzi nr 3

Myślę, że możesz użyć jQuery not() i może być tak proste:

$(document).not("#header, #categoryMore, #headerSearch").click(function() {
$("#header").slideToggle({
duration: 550,
easing: "easeOutExpo"
});
});

Umożliwia to kliknięcie w dowolnym miejscu poza #header i akcja zostanie uruchomiona. Nie musisz się martwić o innych .click() zdarzenia i ich propagacja (przynajmniej nie według mojej wiedzy) ... to po prostu NIE wybierze #header, #categoryMore, i #headerSearch.

Możesz użyć jQuery slideToggle() do przesuwania w górę i w dół nagłówka i jego zawartości za każdym razem, gdy klikniesz poza nim. Jeśli chcesz to tylko ukryć, po prostu użyj .slideUp() tak jak teraz :)

Nadzieja, która pomaga.

---