2010-05-07 15 views
10

Mam niezaudytowaną (ul) listę HTML. Każdy element li ma jedną lub więcej klas dołączonych do niego. Chcę przejrzeć listę ul i uzyskać wszystkie (różne) klasy. Następnie z tej listy utwórz listę pól wyboru, których wartość odpowiada wartości klasy, a także której etykieta jest zgodna z klasą. Jedno pole wyboru dla każdej klasy.Użyj jQuery, aby uzyskać listę klas

Jaki jest najlepszy sposób, aby to zrobić za pomocą jQuery?

+1

Co zrobiliście do tej pory? – jweyrich

+0

nic do tej pory. Właśnie ustawiłem listę. Nie byłem pewien, gdzie zacząć. – John

+0

możliwy duplikat [Pobierz listę klas dla elementu z jQuery] (http://stackoverflow.com/questions/1227286/get-class-list-for-element-with-ququery) – lebolo

Odpowiedz

18

Spróbuj tego:

// get the unique list of classnames 
classes = {}; 
$('#the_ul li').each(function() { 
    $($(this).attr('class').split(' ')).each(function() { 
     if (this !== '') { 
      classes[this] = this; 
     }  
    }); 
}); 

//build the classnames 
checkboxes = ''; 
for (class_name in classes) { 
    checkboxes += '<label for="'+class_name+'">'+class_name+'</label><input id="'+class_name+'" type="checkbox" value="'+class_name+'" />'; 
}; 

//profit! 
+1

Powinieneś sprawdzić, czy "ten" jest pusty ciąg przed dodaniem go do listy, na wypadek gdyby w deklaracji klasy znajdowały się dodatkowe spacje. – Tgr

+0

@ Gratulacje, dzięki. – MDCore

+1

Musisz sprawdzić przed '' ''. Jeśli podzielisz spacją, nigdy nie otrzymasz spacji, ale '' a..b'.split ('.') 'Da' ['a', '', 'b'] ' – Tgr

3

Musiałem także tę funkcjonalność, ale jako dodatek, myśli i podzielić się nim ...

jQuery.fn.getClasses = function(){ 
    var ca = this.attr('class'); 
    var rval = []; 
    if(ca && ca.length && ca.split){ 
    ca = jQuery.trim(ca); /* strip leading and trailing spaces */ 
    ca = ca.replace(/\s+/g,' '); /* remove doube spaces */ 
    rval = ca.split(' '); 
    } 
    return rval; 
} 
Powiązane problemy