jquery - 隐藏 Bootstrap 列表组项

Question

所以我正在使用 JQuery 为列表组创建一个实时搜索类型的东西。

我的搜索完全正常，我正在使用 hide() 来隐藏与当前搜索不匹配的列表组元素，但是，因为我只隐藏元素，第一个和最后一个列表项(在原始列表)保留 first-child 和 last-child 状态，从而保持边界半径并导致搜索结果列表的第一个和最后一个元素没有边界半径，除非它们是原始列表之一。我想知道将边框半径添加到第一个和最后一个非隐藏列表组项的最佳方法是什么。

这是我正在谈论的内容的一部分:http://www.bootply.com/M6g7cEeRon

Answer 1

将这段代码放在 $(".list-group-item").each(function() {}); 下面，这是我的 [fiddle]..( http://jsfiddle.net/HmrJz/1/ )

$(".list-group-item:visible").each(function(index) {
     if(index == 0){
         $(this).css("border-top-left-radius", "10px");
         $(this).css("border-top-right-radius", "10px");
     }
     if(index == $(".list-group-item:visible").length - 1){
         $(this).css("border-bottom-left-radius", "10px");
         $(this).css("border-bottom-right-radius", "10px");
     }
 });