jquery - 排序列出其风格

Question

我有一个动态创建的列表如下：

<ul id="Bucket-1" class="list1" data-listidx="11">
<li><div style="cursor: pointer;">BYBO2</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">FURG4</div></li>
<li><div style="cursor: pointer;">HCLB8</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">KVQF1</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">LYPI6</div></li>
<li><div style="cursor: pointer;">MLET3</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">MPZM9</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">RFHP7</div></li>
<li style="display: none;"><div style="cursor: pointer; display: none;">TEAR5</div></li>
</ul>

我必须通过 jquery<li>对上面应用排序，其中<li>不包含style="display:none"

Answer 1

您可以使用 css 类代替，并在此 POSTdisplay:none css中使用简单的解决方案 ：

.visible-li{}
.hidden-li{display:none;}

html:

<ul id="Bucket-1" class="list1" data-listidx="11">
<li class="visible-li"><div style="cursor: pointer;">BYBO2</div></li>
<li class="hidden-li"><div style="cursor: pointer;">FURG4</div></li>
<li class="visible-li"><div style="cursor: pointer;">ACLB8</div></li>
<li class="hidden-li"><div style="cursor: pointer;">KVQF1</div></li>
<li class="hidden-li"><div style="cursor: pointer;">LYPI6</div></li>
<li class="visible-li"><div style="cursor: pointer;">MLET3</div></li>
<li class="hidden-li"><div style="cursor: pointer;">MPZM9</div></li>
<li class="hidden-li"><div style="cursor: pointer;">RFHP7</div></li>
<li class="hidden-li"><div style="cursor: pointer;">TEAR5</div></li>
</ul>

最后在推荐的帖子中使用解决方案

在JSFIDDLE上查看