Question

我有一个包含多个列表的页面。每个列表都有不同数量的列表项。我希望在每三个列表项后显示一个更少/更多的链接，如果我的列表中包含少于3个项目，我想隐藏更少/更多的链接。

这是我到目前为止所得到的：

    var n = $('ol.checkboxes').children.length;

    if (n > 3) {
           $('ol.checkboxes')
            .find('li:gt(2)')
            .addClass('toggleli')
            .hide()
            .end()
            .append(
                 $('<li class="collapsed">More>>  </li>').click(function(){
                 $(this).siblings('.toggleli').toggle();
              if($(this).hasClass('expanded')){
                  $(this).text(metaData['MORE_TEXT']);
                  $(this).removeClass('expanded');
              } else{
                  $(this).text(metaData['LESS_TEXT']);
                  $(this).addClass('expanded');
              }
        }));
       }
     });

不幸的是，这会计算ol.checkbox中的所有列表项。任何帮助将不胜感激！

Answer 1

使用$("ol").find('li').length

并且不止一次使用

$("ol").each(function(){
 var len = $(this).find('li').length; //if nested list then use children() instead find()
 if (len>3){
  //do stuff
 }
});

计算页面上每个列表的项目

1 个答案: