jQuery, wie Sie auf Klasse hinzufügen, um bestimmte div ' s

Gibt es eine Möglichkeit, um eine Klasse durch jquery auf alle divs mit ul ist mit nur einem element in der Liste (wie div.filter_7). Mit jQuery habe ich müssen gehen durch jeder div.list-container und die Anzahl der Listen-Elemente. Wenn die Listen-Elemente sind niedriger als 2 ist, dann ist jquery Anhängen a-Klasse.

<div class="filter_group">
<div class="filter-holder filter_1">
<h4>Test</h4>
<div class="list-container">
    <ul class="list filter">
        <li class="list_id1">list_id1</li>
        <li class="list_id2">list_id2</li>
        <li class="list_id3">list_id3</li>
        <li class="list_id4">list_id4</li>
        <li class="list_id5">list_id5</li>
    </ul>
</div>
</div>
<div class="filter-holder filter_2">
<h4>Test</h4>
<div class="list-container">
    <ul class="list filter">
        <li class="list_id11">list_id11</li>
        <li class="list_id22">list_id22</li>
        <li class="list_id33">list_id33</li>
        <li class="list_id44">list_id44</li>
        <li class="list_id55">list_id55</li>
    </ul>
</div>
</div>
<div class="filter-holder filter_6">
<h4>Test</h4>
<div class="list-container">
    <ul class="list filter">
        <li class="list_id111">list_id111</li>
        <li class="list_id222">list_id222</li>
        <li class="list_id555">list_id555</li>
    </ul>
</div>
</div>
<div class="filter-holder filter_7">
<h4>Test</h4>
<div class="list-container">
    <ul class="list filter">
        <li class="list_id1111">list_id1111</li>
        <li class="list_id2221">list_id2222</li>
    </ul>
</div>
</div>

Hier ist, was ich bisher gemacht habe mit jquery, aber es scheint falsch:

    var total = 0;
$(document).ready(function() {
    $('.list-container').each(function(idx, item){
      total = $(".list-container>ul").size();
          if (6 >= total) {
           $('.list-container').parent('div').addClass('noshow');
    } else {
    alert(total);
    }              
    });
});

Können wir sicher davon ausgehen, dass jeder <div> wird immer nur einer enthalten <ul> oder brauchen wir, um Konto für, sagen wir, ein <div> hat eine <ul> mit nur einem element und einen zweiten <ul> dass mehrere Elemente hat (und, wenn wir das tun, sollten diese ausgeblendet werden oder nicht?).
Warten... ist es "niedriger als zwei" oder "nur eine" list-Element. Bedeutet eine leere Liste bekommen Nichterscheinen wird die Klasse auch? Der code nicht exakt deine Frage.

InformationsquelleAutor vangelis | 2012-03-21

6

Sie nicht brauchen, zu filtern oder zu jeder...

Können Sie jQuery.hat() in Verbindung mit :only-child. Wie gesehen werden kann, in dieses jsFiddle demo und code.
```
jQuery("div.list-container").has("li:only-child").addClass("noshow");
```
Es ist WEG cleaner zu Lesen, als mit filter. Sie können ändern, die hat ein bisschen mehr spezifisch ist.

Nette Antwort, +1

InformationsquelleAutor scottheckel
3

Hart zu arbeiten heraus, was Sie genau wollen, wie Ihr text nicht wirklich passend zu Ihrem Beispiel html oder JS, aber versuchen Sie dies:
```
$('div.filter-holder').filter(function() {
    return $(this).find('li').length == 1;
}).addClass('noshow');
```
Beispiel - http://jsfiddle.net/infernalbadger/hyCaJ/

InformationsquelleAutor Richard Dalton
1
```
$('div.filter-holder').filter(function(){
  return $('div.list-container li',this).length <= 2;
}).addClass('noshow');
```
Können Sie .filter() anwenden komplexere Logik zu einem Ergebnis-Satz (Rückgabe von true hält das element in der Menge, während false zurückgeben, entfernt es aus der Menge.

Fiddle Beispiel: http://jsfiddle.net/pMvHu/1/

Gerade gefangen, Sie waren versucht, die Klasse des parent-div (.filter-holder), nicht in der Liste container (.list-container). Code aktualisiert.

InformationsquelleAutor Brad Christie

Versuchen unterhalb der Skript,

DEMO

$('.filter-holder').filter (function () {
   return ($(this).find('ul li').length == 1) //Edit: changed to ==
}).addClass('noshow');

InformationsquelleAutor Selvakumar Arumugam

versuchen Sie es mit '.length statt:

$('.list-container').each(function(){
  if ($('li', this).length <= 2) {
    $(this).parent().addClass('noshow');
  }
});

http://jsfiddle.net/we8Jj/

jquery size() und length die gleichen 🙂

InformationsquelleAutor Alex

$('div.list-container').each(function() {
    if ($(this).find('ul').length >= 6) {
        $(this).addClass('noshow');
    }
});

InformationsquelleAutor MightyE

Sie zu rechnen haben, die li's in jedem ul.

$('div.filter-holder ul').each(function() {
    if($(this).children().length == 1)
    {
        $(this).parent().parent().addClass('test')
    }
});

DEMO

InformationsquelleAutor Frank van Wijk

0

angenommen "link_shopall" div-id, dann auf Klasse hinzufügen aktiv
```
$('#link_shopall').classList.add('active')
```
Entfernen
```
$('#link_shopall').classList.remove('active')
```
InformationsquelleAutor Sabir Hussain

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.