jquery - 显示隐藏 li 元素 jQuery

Question

如何显示 li 元素然后隐藏它们。我在下面隐藏了我不想显示的列表项，当我单击 a.show-button 链接时它会显示所有列表项，但我也想在更改其后单击相同的链接来隐藏列表项班级。似乎无法让它提醒你好。我查了一下，课程发生了变化。我究竟做错了什么？

$('ul.artists li:gt(27)').hide();

$('a.show-button').click(function(e) {
e.preventDefault();
    $('ul.artists li:gt(27)').show();
    $(this).addClass('hide-button').removeClass('show-button');
});

$('a.hide-button').on('click', function(e) {
e.preventDefault();
    alert("Hello");
});

Answer 1

不要更改类名来显示和隐藏，而是尝试使用切换。

$('ul.artists li:gt(27)').hide();

$('a.buttonClass').click(function(e) {
  e.preventDefault();
  $('ul.artists li:gt(27)').toggle();

});

Answer 2

这里不是关于如何去做，而是关于你做错了什么。

当您将单击操作绑定到 时$('a.hide-button')，您将其绑定到具体元素。如果新元素开始适合此选择器，则该元素不会自动绑定该单击操作。