我有一个无序列表，如果有超过3个，我将隐藏所有其他列表项。此后，我调用一个JQuery函数，该函数在底部放置一个“显示更多”链接，并切换要显示的所有其他列表项。
但是，我有点卡住了，我想在所有列表项都显示后将show链接转换为“Hide”，然后单击该链接，然后隐藏其他列表项，然后链接更改回“Show more。”。 ”。
这是我到目前为止可以用来扩展并显示其他列表项的代码。
$('ul li:gt('+index+')').hide();
$('ul').append('<li class="more"><a href="#">Show more...</a></li>');
$('ul li.more a').click(function() {
$('ul li.more a').remove();
$('ul li:gt('+index+')').show();
});
请注意，我不会停留在此代码上，如果有更好的方法来实现整个显示/隐藏代码，那很好。
我用到目前为止的代码编写了一个fiddle。
最佳答案
在这里，jQuery toggle()函数派上了用场-您可以附加到事件处理程序，每单击一次元素就会调用该事件处理程序。使用text()更改链接的文本(如果您不打算进行后备广告，则不应该使用链接-而是使用span)
更新了fiddle。