MISortable

功能描述

Sortable.js是一款轻量级的拖放排序列表的js插件 可以从一个列表容器中拖拽一个列表单元到本列表容器中进行排序 可以实现从一个列表拖动到另一个列表。您拖动的项目将被克隆，克隆将保留在原始列表中。 可以实现左侧的列表禁用。 从左侧列表拖动到右侧列表。 网格排列 .....

依赖的插件

Sortable.js

快速使用

1.通过Sorable对象中的create方法创建
  如：
    var el = document.getElementById('demo');
    var sortable = Sortable.create(el,{});
  
2.属性描述
handle: selector 格式为简单css选择器的字符串，使列表单元中符合选择器的元素成为拖动的手柄，只有按住拖动手柄才能使列表单元进行拖动；
animation: number 单位：ms，定义排序动画的时间；
group: {
    name: 'Cloning',自定义名字，必须和要克隆的列表名字一样
    pull: 'clone'	克隆
    put: false		不允许将项放入此列表
    invertSwap:true	反向互换
 },
3.方法描述
onAdd: function 列表单元添加到本列表容器的回调函数
onStart: function 列表单元拖动开始的回调函数
onEnd: function 列表单元拖放结束后的回调函数
onUpdate: function 列表单元在列表容器中的排序发生变化后的回调函数
onRemove: function 列表元素移到另一个列表容器的回调函数

4.evt 事件对象在各个函数中略有不同，可通过输出对象查看对象的属性，如下：
    item：HTMLElement–被移动的列表单元
    oldIndex：number/undefined–在列表容器中的原序号
    newIndex：number/undefined–在列表容器中的新序号

5.也可以用new  Sortable方法直接使用
new Sortable(Sharedrigth, {			Sharedrigth是id的值
    group: 'Shared',
    animation: 150
  });

特别说明

是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18