jQuery: li -elemente innerhalb von ul zählen?

sepp88 · #1 (**permalink**) 04.07.2010, 12:05

Hallo Leute,
ich frage mich was ich falsch mache?

PHP-Code:


			
    $('#menu ul li').each(function(){

        if ($(this).length > 2)

            $('#menu ul').append("<li class='dots'>…</li>");

    });

ich möchte allen ul's die mehr als zwei li's enthalten, 3 Punkte appenden.

Allerdings mach ich da noch irgendetwas falsch! Im Moment werden jeder ul 3 Punkte appended.

Könnt ihr mir vielleicht sagen was?

danke für die Hilfe

Thielo · #2 (**permalink**) 04.07.2010, 13:39

Hallo Sepp, du hast nen Denkfehler in der Ganzen Sache:
Schritt 1: Du nimmst alle li Elemente in den uls in dem Bereich mit der ID menu
Schritt 2: du überprüfst die anzahl der Elemente die in jedem aktuellen element (#menu ul li) vorhanden sind. Was ja immer nur 1 ist. (ich gehe davon aus das das Ganze ungefähr so ausschaut:

HTML-Code:

<div id="menu">
		<ul id="1">
			<li><a href="">bla</a></li>
		</ul>
		<ul id="2">
			<li><a href="">bla</a></li>
		</ul>
		<ul id="3">
			<li><a href="">bla</a></li>
			<li><a href="">bla</a></li>
			<li><a href="">bla</a></li>
		</ul>
		<ul id="4">
			<li><a href="">bla</a></li>
		</ul>
	</div>

die IDs in den uls sind von meinen Tests

Es ist in jedem li also 1 Element, aber das willst du ja nicht wissen, du möchtest wissen wieviele lis in einem ul sind richtig?

mit anderen Worten müsste der erste Teil des JS so lauten:

Code:

$('#menu ul').each(function(){
});

als nächstes überprüfen wir nun ob die Anzahl der Elemente in einem ul größer (oder gleich) als 2 ist:

Code:

$('#menu ul').each(function(){
				if($(this).children().length > 2){}
			});

Im letzten Schritt müssen wir wenn das Ganze "true" ist, dem jeweiligen ul ein li reinwerfen.

Code:

$(this).append('<li class="dots">&hellip;</li>');

Im gesamten Code sieht das Ganze wie folgt aus:

Code:

$('#menu ul').each(function(){
				if($(this).children().length > 1){ $(this).append('<li class="dots">&hellip;</li>'); }
			});

Sollte helfen

sepp88 · #3 (**permalink**) 04.07.2010, 18:52

danke vielmals, so funktioniert es schon fast genau so wie ich es haben wollte.

ich würde nur noch gerne überprüfen ob die jeweilige ul die ich mit der each-Schleife durchlaufe noch zusätzlich zwei children mit zwei bestimmten Klassen hat.

ich weiß das ist komisch, aber ich will das … immer nur dann einer ul anhängen, wenn

#mehr als zwei li's drin sind
#eine li in der ul eine klasse ".section-title" hat
#eine li in der ul eine ".active" hat

also ich würde noch gerne

PHP-Code:


			
$('#menu ul').each(function() {

    if($(this).children().length > 2) {

        $(this).children(':has(.section-title, li.active)').append('<li class="dots">&hellip;</li>');

    }

});

So klappt es leider nicht. Wie könnte ich denn das lösen?

Thielo · #4 (**permalink**) 05.07.2010, 04:41

Hallo Sepp, es geht wahrscheinlich schöner aber es läuft

Code:

$('#menu ul').each(function(){
	$el = $(this);
	if($(this).children().length > 1 && $(this).children().hasClass("active") && $(this).children().hasClass("section-title")){
		$(this).append('<li class="dots">&hellip;</li>');
	}
});

sepp88 · #5 (**permalink**) 05.07.2010, 11:55

danke! ich habs mit find() gelöst.

Thielo · #6 (**permalink**) 05.07.2010, 20:52

Wäre ja jetzt natürlich noch geil wenn du deine Lösung kurz zeigen könntest, interessiert mich nämlich auch

)

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
jQuery und Cookies: Position mehrerer Elemente speichern?	sepp88	Javascript & Ajax	2	06.05.2011 13:59
jquery - hover und mehrere elemente	monran	Javascript & Ajax	8	20.04.2011 20:01
JQUERY und gewisse Anzahl an Elemente einblenden	sturmi2	Javascript & Ajax	7	10.11.2009 16:50
Elemente mit Javascript zählen	therug	Javascript & Ajax	12	15.11.2008 09:06
Problem bei Link Pseudo - Elemente innerhalb ID	vidar	CSS	2	16.02.2007 11:16