0

我有多个列表：

    <ul id="list2">
            <li><a href="item.php?id=7">2A</a></li>
            <li><a href="item.php?id=2">2B</a></li>
            <li><a href="item.php?id=9">2C</a></li>
            <li><a href="item.php?id=4">2D</a></li>
            <li><a href="item.php?id=11">2E</a></li>
    </ul>
    <ul id="list3">
            <li><a href="item.php?id=7">3A</a></li>
            <li><a href="item.php?id=2">3B</a></li>
            <li><a href="item.php?id=9">3C</a></li>
    </ul>

如果有超过 3 个列表项，我使用 jquery 来切换显示更多/更少的列表。

问题是，如果所有项目都可见并且没有任何项目可以切换，我不想更多/更少地显示文本。

查询：

    <script type="text/javascript">
    $('ul[id^=list]').each(function(){

    if ( $('ul[id^=list]').children().length > 3 ) {

        $(this).children('li:gt(3)').hide(); 
        $(this).after('<a href="#" class="showhideul">More/Less</a>');
    }
          });
          $('.showhideul').click(function(e){
                e.preventDefault();
                $(this).prev('ul[id^=list]').children('li:gt(3)').toggle('slow');
                $('ul[id^=list]').not($(this).prev('ul[id^=list]')).each(function(){
                      $(this).children('li:gt(3)').hide();
                });
          });
    </script>

链接到我的代码：http: //jsfiddle.net/Qvrsd/

4

2 回答 2

2

看到这个：http: //jsfiddle.net/Qvrsd/1/

$('ul[id^=list]').each(function () {

  if ($(this).children().length > 3) {     //<--  use $(this) instead of $('ul[id^=list]')

    $(this).children('li:gt(3)').hide();
    $(this).after('<a href="#" class="showhideul">More/Less</a>');
  }
});
$('.showhideul').click(function (e) {
  e.preventDefault();
  $(this).prev('ul[id^=list]').children('li:gt(3)').toggle('slow');
  $('ul[id^=list]').not($(this).prev('ul[id^=list]')).each(function () {
     $(this).children('li:gt(3)').hide();
  });
});
于 2013-04-15T12:59:01.223 回答
2

在以下情况下使用$(this)，而不是$('ul[id^=list]')你很高兴去。

if ( $('ul[id^=list]').children().length > 3 ) {
    $(this).children('li:gt(3)').hide(); 
    $(this).after('<a href="#" class="showhideul">More/Less</a>');
}
于 2013-04-15T13:00:47.587 回答