Question

我有一个显示/隐藏效果，但我只需要能够在页面中多次使用它。目前它切换所有元素。无法理解如何做到这一点。

希望你能提供帮助。

http://pastebin.me/29328e556caf53e9a1925030d65b864b

Answer 1

您可以稍微编辑一下这个函数，它会在每个<ul>上无效地工作：

$('.facet ul').each(function() {
  if($(this).children('li:gt(9)').hide().length === 0) return;
  $(this).append(
    $('<li id="toggler">More</li>').toggle(function() {
       $(this).text('Hide').siblings().show();
    }, function() { 
       $(this).text('More').siblings('li:gt(9)').hide();
    }));
});

See a working demo here

之前，任何li超过9，您希望使用<ul> 每个 .each()元素执行此操作，如上例所示。

Answer 2

我删除了一些内容以简化，但你可以在这里看到一个有效的实现...为了保持togglers为li元素，你需要扩展它以选择性地隐藏兄弟元素 - 但我是一个粉丝简单，所以我建议将切换器保留在想要显示/隐藏的元素之外。

http://pastebin.me/7a7e139da8cad2b01593d895b668c17e

jquery切换到多个实例中工作

2 个答案: