2017-02-16 3 views
-1

Ich möchte die Label-Anzahl für div bekommen und ich bekomme die Anzahl aller Labels in diesem div. Eigentlich + Button wird angezeigt, wenn die Anzahl der Etiketten mehr als 5 ist, sonst verstecke ich diese Schaltfläche mit jquery, aber eigentlich ist, was ich will ist, wenn die Anzahl der Etiketten mehr als 5 bedeutet, sollte die Schaltfläche zusammen mit count erscheinen. Zum Beispiel, wenn 6 Etiketten gibt es bedeutet Taste erscheint und auch 1 mehr es zeigen sollte, ist, was ich will einige Körper Hilfe bitte ..Jquery zeigen mehr Label zählen?

$('#filter-group21').each(function() { 
 
    var label_count = 1; 
 
    label_count = $(this).find('label').length; 
 
    // alert(label_count); 
 
    $(this).find('label:gt(4)').hide(); 
 
    // $(this).find('div:gt(5)').hide(); 
 
    // display load more if there are more than 5 filters 
 
    $(this).find(".loadMore").toggle(label_count > 5); 
 

 
}); 
 

 
$('.loadMore').click(function() { 
 
    $(this).next().show(); 
 
    $(this).parent().find('label').show(); 
 
    // $(this).parent().find('div').show(); 
 
}); 
 
// On click of - button need to show only top 5 filter elements 
 
$('.showLess').click(function() { 
 
    $(this).hide(); 
 
    $(this).parent().find('label').not(':lt(5)').hide(); 
 
    // $(this).parent().find('div').not(':lt(5)').hide(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="filter-group21" class="cf"> 
 
    <!--<input type="text" id="dino-search_21" placeholder="Search By FABRIC"> --> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="144" /> 
 
       Chiffon </label> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="145" /> 
 
       Corduroy </label> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="146" /> 
 
       Cotton </label> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="147" /> 
 
       Crepe</label> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="148" /> 
 
       Denim</label> 
 
    <label class="checkbox cb_test"> 
 
       <input name="filter[]" type="checkbox" value="162" /> 
 
       Silk</label> 
 
    <button class="loadMore" title="Load more">+</button> 
 
    <button class="showLess" title="Load more">-</button> 
 
    </ul> 
 
</div>

Antwort

0

Versuchen Sie, diese

$('#filter-group21').each(function() { 
    var label_count = 0, 
    limit = 5; 
    label_count = $(this).find('label').length - limit; 
    $(this).find('label:gt(4)').hide(); 
    if (label_count > 0) { 
    $('.loadMore').append(label_count + 'more') 
    } 
}); 

Fiddle Demo

Ich habe rund 8 Etiketten hinzugefügt. So wird es zeigen +3 mehr