本站消息
按数据值对列表项进行排序
发布于2024-12-12 18:09 阅读(449) 评论(0) 点赞(1) 收藏(4)
我如何通过数据值或其他方法设置 li 项的排序？
<ul>
<li id="two" data-value="3"> 1 </li>
<li id="three" data-value="1"> 2 </li>
<li id="one" data-value="2"> 3 </li>
</ul>
//输出必须是 3 1 2 但是我有超过 100 个项目
解决方案
对数据值使用排序逻辑li并更新ulhtml。
$("#test").html(
$("#test").children("li").sort(function (a, b) {
var val1= parseInt($(a).data('value'));
var val2= parseInt($(b).data('value'));
return val1-val2;
})
);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="test">
<li id="two" data-value="3"> 1 </li>
<li id="three" data-value="1"> 2 </li>
<li id="one" data-value="2"> 3 </li>
</ul>所属网站分类: 技术文章 > 问答
作者：黑洞官方问答小能手
链接：http://www.qianduanheidong.com/blog/article/538562/df390cac812b0632e738/
来源：前端黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
1
0
收藏该文
昵称:
评论内容：(最多支持255个字符)
---无人问津也好，技不如人也罢，你都要试着安静下来，去做自己该做的事，而不是让内心的烦躁、焦虑，坏掉你本来就不多的热情和定力
程序员的那些事(new)
电子书(new)
博客(new)
视频教程(new)
问答(new)
游戏(new)