jquery - đếm li trong mỗi giá trị ul và trả về

Sử dụng jQuery, làm cách nào để đi qua từng ul.item lồng nhau, đếm số lượng LI và trả về kích thước/độ dài đó trong span.someClass mẹ trên trang đó ?jquery - đếm li trong mỗi giá trị ul và trả về

<ul> 
    <li><span class="someClass">3</span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
     <li>count me</li> 
     <li>count me</li> 
    </ul> 
    </li> 
    <li><span class="someClass">1</span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
    </ul> 
    </li> 
    <li><span class="someClass">2</span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
     <li>count me</li> 
    </ul> 
    </li> 
</ul>

Nguồn

2012-11-21 dissident

Hiện chúng tôi biết mã bạn đã cố gắng cho đến nay. –

<html> 
<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript"> 
     $(function() { 
      var count = 0; 
      $('ul').each(function(){ 
       if(count != 0){ 

        var len = $(this).find('li').length; 

        $(this).parent().find('.someClass').html(len); 
       } 
       count++; 

      }) 
     }); 

    </script> 
</head> 
<body> 
<ul> 
    <li><span class="someClass"></span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
     <li>count me</li> 
     <li>count me</li> 
    </ul> 
    </li> 
    <li><span class="someClass"></span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
    </ul> 
    </li> 
    <li><span class="someClass"></span> 
    <ul class="item" style="display:none"> 
     <li>count me</li> 
     <li>count me</li> 
    </ul> 
    </li> 
</ul> 
</body> 
</html>

Nguồn

2012-11-21 17:05:01

Hãy thử điều này,

Live Demo

$('.someClass').each(function(){  
    $(this).text($(this).next('ul').find('li').length); 
})

Nguồn

2012-11-21 16:51:50 Adil

LIs nằm trong UL không nằm trong SPAN. '$ (this) .next ('ul'). Tìm thấy ('li'). Length' –

$("ul.item").each(function() { 
    // reusabilty 
    var context = $(this); 
    // count and populate 
    context.prev(".someClass").text(context.children().length); 
});

Bỏ qua .someClass trong prev() cuộc gọi nếu những yếu tố span luôn ngay trướcul yếu tố của bạn. Trong trường hợp đó, việc lọc trong prev là không cần thiết và không cần thiết.

Nguồn

2012-11-21 16:54:05

Bạn có thể sử dụng phương pháp text:

$('.someClass').text(function(){ 
    return $(this).next().find('li').length 
})

http://jsfiddle.net/EEsRR/

Nguồn

2012-11-21 16:54:50 undefined

ah .. bạn đánh bại tôi với nó –

$("ul.item").each(function() { 
    var _c = $(this); 
    _c.siblings("span.someClass").html(_c.children("li").length); 
});

Nguồn

2012-11-21 16:58:32 tgormtx

Vòng trough mỗi <li> với jQuery:

$(document).ready(function(){ 

    var howMany; 
    // loop through every span.someClass 
    $('.someClass').each(function(){ 
    // loop through every <li> within that span.someClass 
    $('li').each(function(){ 
     // .index() is the current index of the $(this) object, it starts at 0, therefore .index()+1 
     howMany = $(this).index()+1; 
    }); 
    // Write your counted <li> in your <span> with .text(), manipulate the text within the <span> tags 
    $(this).text(howMany); 
    }); 
});

Did it work?

Nguồn

2012-11-21 17:04:11 Munchies

nah điều này chỉ hiển thị một giá trị, cảm ơn mặc dù – dissident

-1

$('#yourelementid > li').length;

này sẽ làm việc cho bạn thay vì sử dụng bất kỳ vòng lặp

Nguồn

2014-04-02 09:39:08

jquery - đếm li trong mỗi giá trị ul và trả về

Trả lời

Các vấn đề liên quan