[JQuery] Unterbereich aus einem Selektor ausschliessen

Yaslaw

alter Rempler
Moderator
So, mich plagt wieder mal der Schuh bei JQuery.

Ich habe folgendes vereinfachtes HTML-Konstrukt
HTML:
<ul class="deepLevel1">
	<li>
		<a href="foo">Text1</a>
		<a href="bar" class="recalcCounts">
			<img src="icon.png" class="recalcCounts" />
		</a>
	</li>
</ul>

Folgenden JQuery Selektor habe ich im Moment.
Javascript:
$('ul.deepLevel1').click(function(){
	//TODO: mach was mit $(this)
});

Was ich jetzt aber noch will, ist dass bei einem Klcik auf die Unterelemente mit der class "recalcCounts" nix ausgeführt wird.
Also anderst ausgedrückt:

Mach beim Klicken auf ul.deepLevel1 etwas ausser es wurde auf das Icon mit class .recalcCounts geklickt.
 
Du hast also verschiedene Listen-Elemente, die Elemente mit der Klasse "recalcCounts" enthalten können, aber nicht müssen. Habe ich das so richtig verstanden? Dann verwende doch den has-Selektor.

Code:
$("ul.deepLevel1:not(:has(.recalcCounts))").on("click", function () {
  // do something
});
 
Oder wenn man es anders versteht, nämlich dass man auf den Text klicken darf, aber nicht auf das Icon:

Javascript:
$('ul.deepLevel1').click(function(e){
    if($(e.target).hasClass('recalcCounts')) return;

    //TODO: mach was mit $(this)
});
 
SO wie CPoly es schrieb. Es soll auf ein Klick reagieren, ausser man klickt auf das Icon innerhalb des li-Tags.
Ich werde morgen im Büro mal das mit e.target probieren. Das kannte ich bissher noch nicht.

Nachtrag:
Danke euch beide. Das von CPoly macht genau das was ich gesucht habe. Sensationell.
 
Zurück