Ich möchte für jede “Phrase” alle Elemente in “items” in einer Textvariablen wie folgt erhalten:
var string = "TEXT1 - BLANK - TEXT2";
Ich habe derzeit diesen Javascript-Code:
<script>
$(function() {
$('.phrase .items').each(function(){
var myText = "";
// At this point I need to loop all li items and get the text inside
// depending on the class attribute
alert(myText);
});
};
</script>
Wie kann ich alle iterieren <li> Innerhalb .items?
Ich habe verschiedene Wege ausprobiert, aber ich habe keine guten Ergebnisse erzielt.
WSkid
Zuerst denke ich, dass Sie Ihre Listen als ersten Knoten von a reparieren müssen <ul> muss ein sein <li> (Stapelüberlauf-Referenz). Sobald dies eingerichtet ist, können Sie Folgendes tun:
// note this array has outer scope
var phrases = [];
$('.phrase').each(function(){
// this is inner scope, in reference to the .phrase element
var phrase="";
$(this).find('li').each(function(){
// cache jquery var
var current = $(this);
// check if our current li has children (sub elements)
// if it does, skip it
// ps, you can work with this by seeing if the first child
// is a UL with blank inside and odd your custom BLANK text
if(current.children().size() > 0) {return true;}
// add current text to our current phrase
phrase += current.text();
});
// now that our current phrase is completely build we add it to our outer array
phrases.push(phrase);
});
// note the comma in the alert shows separate phrases
alert(phrases);
Eine Sache ist, wenn Sie die bekommen .text() einer oberen Ebene li Sie erhalten damit den gesamten Text der Unterebene.
Das Beibehalten eines Arrays ermöglicht das Extrahieren vieler mehrfacher Phrasen.
BEARBEITEN:
Das sollte mit einem leeren besser funktionieren UL ohne LI:
// outer scope
var phrases = [];
$('.phrase').each(function(){
// inner scope
var phrase="";
$(this).find('li').each(function(){
// cache jquery object
var current = $(this);
// check for sub levels
if(current.children().size() > 0) {
// check is sublevel is just empty UL
var emptyULtest = current.children().eq(0);
if(emptyULtest.is('ul') && $.trim(emptyULtest.text())==""){
phrase += ' -BLANK- '; //custom blank text
return true;
} else {
// else it is an actual sublevel with li's
return true;
}
}
// if it gets to here it is actual li
phrase += current.text();
});
phrases.push(phrase);
});
// note the comma to separate multiple phrases
alert(phrases);
Das funktioniert für mich, aber ich muss wissen, wann ul kein li hat, also sollte ich in diesem Fall “BLANK” als Text bekommen. Vielleicht war mein Beitrag überhaupt nicht klar. Ich verstehe diese Zeile nicht: if(current.children().size() > 0) {return true;} Danke für deine Antwort.
– rusben
16. Mai 2011 um 13:08 Uhr
Nun, das ist technisch gesehen kein gültiges Markup. Aber Sie können damit arbeiten, indem Sie diese Zeile verwenden. Ich werde meine Antwort mit einigen klärenden Kommentaren aktualisieren – sie ist jetzt aktualisiert!.
– WSkid
16. Mai 2011 um 13:14 Uhr
Ich habe meine Frage bearbeitet. Ich werde niemals mit Extrange-Code ul. Nur ul mit li oder
– rusben
16. Mai 2011 um 13:21 Uhr
Okie dokie — eine zweite Funktion hinzugefügt und jsfiddle aktualisiert.
Angesichts einer Antwort, die so hoch gestimmt und angesehen wurde. Ich habe die Antwort mit einer Mischung aus hier und anderen Links gefunden.
Ich habe ein Szenario, in dem alle patientenbezogenen Menüs deaktiviert sind, wenn kein Patient ausgewählt ist. (Siehe Link – So deaktivieren Sie ein li-Tag mit JavaScript)
//css
.disabled{
pointer-events:none;
opacity:0.4;
}
// jqvery
$("li a").addClass('disabled');
// remove .disabled when you are done
Anstatt also langen Code zu schreiben, habe ich eine interessante Lösung über CSS gefunden.
$(document).ready(function () {
var PatientId ;
//var PatientId =1; //remove to test enable i.e. patient selected
if (typeof PatientId == "undefined" || PatientId == "" || PatientId == 0 || PatientId == null) {
console.log(PatientId);
$("#dvHeaderSubMenu a").each(function () {
$(this).addClass('disabled');
});
return;
}
})