layui table表格排序后 清除排序箭头/恢复默认排序
时间: 2024-09-24 22:12:08 浏览: 79
layui2.2.5表格排序功能自定义扩展
layui表格中的排序功能通常通过`lay-filter`和`lay-sort`属性配合使用来实现。如果你想清除排序箭头并恢复默认排序状态,可以在需要的时候操作对应的表格元素。以下是一个基本的例子:
```html
<table id="demo" lay-filter="demo" lay-data="tableData" lay-skin="layui">
<!-- 表格列配置 -->
<thead>
<tr>
<th lay-sort="asc">姓名</th>
<th lay-sort="desc">年龄</th>
</tr>
</thead>
<!-- 表格数据 -->
</table>
<!-- 操作按钮或其他触发排序的地方 -->
<button onclick="resetSort()">清除排序</button>
<script>
function resetSort() {
$('#demo').find('.layui-table-header').each(function(index, element) {
$(element).find('i').remove(); // 移除排序箭头
$(element).attr('data-lay-skip', ''); // 取消当前列的排序标志
});
$('#demo').trigger('reload'); // 刷新表格数据,恢复默认排序
}
</script>
```
在这个示例中,`resetSort`函数会遍历表格头部单元格,移除所有的排序图标`<i>`,然后取消`data-lay-skip`标记,最后通过`reload`方法触发表格重新加载,达到恢复默认排序的效果。
阅读全文