如何删除带有 jQuery 的 <li></li> 元素

Question

我在移除、隐藏 IdealForms 上的 <li></li> 元素时遇到问题，首先和最后隐藏它很容易，请参见下文。但是，如何隐藏元素编号 4、5 和 6？

$('.idealsteps-nav li:first').hide();
$('.idealsteps-nav li:last').hide();

Answer 1

您可以使用

$('.idealsteps-nav li:not(:first,:last),').hide();

Answer 2

Html

<ul id="sortable">
   <li id="1" class="ui-state-default">First <a href='#' title='delete' class="itemDelete">x</a></li>
   <li id="2" class="ui-state-default">Second <a href='#' title='delete' class="itemDelete">x</a></li>
   <li id="3" class="ui-state-default">Third <a href='#' title='delete' class="itemDelete">x</a></li>
 </ul>

JS

 $('#sortable').on('click', '.itemDelete', function() {
        $(this).closest('li').remove();
    });

Answer 3

使用 CSS3 选择器

如果你希望你的代码与你用选择器隐藏第一个和最后一个元素所做的一致，你可以做类似的事情：

$('.idealsteps-nav li:nth-child(4)').hide();
$('.idealsteps-nav li:nth-child(5)').hide();
$('.idealsteps-nav li:nth-child(6)').hide();

如何删除带有 jQuery 的 <li></li> 元素

How to remove <li></li> element with jQuery on Ideal forms

javascript

jquery

idealforms