jquery.sortable.js

作者admin

3月 20, 2024

jQuery Sortable 是一个 jQuery 插件，用于实现可排序的列表功能。它允许用户通过拖拽来重新排序列表中的元素，非常适用于需要交换元素位置的场景，比如任务列表、菜单排序等。

<!-- 可排序的列表 -->
<ul id="sortable">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>
// 当文档加载完成后执行
$(document).ready(function(){
// 使用 sortable() 方法将 #sortable 元素设置为可排序
$("#sortable").sortable();
});

参数

参数名	描述
axis	设置拖拽的轴向，可以是 ‘x’（水平）或 ‘y’（垂直）。
containment	设置拖拽的范围，可以是 ‘parent’、’document’ 或选择器。
cursor	设置拖拽时鼠标的样式。
delay	设置触发拖拽动作之前的延迟时间，以毫秒为单位。
disabled	禁用或启用可排序功能。
distance	设置开始拖拽前的鼠标移动距离。
grid	设置拖拽时的网格大小。
handle	设置拖拽手柄，只有拖拽手柄才能触发拖拽。
helper	设置拖拽时显示的辅助元素，可以是 ‘original’ 或 ‘clone’。
opacity	设置拖拽时的不透明度。
revert	设置拖拽结束后的行为，可以是 true、’invalid’ 或一个函数。
scroll	设置拖拽时滚动的容器。
scrollSensitivity	设置滚动触发的敏感度。
scrollSpeed	设置滚动的速度。
tolerance	设置拖拽排序时的容差。