html5 Sortable.js 拖拽排序源码分析 - qq281113270(2)_H5之家

onAdd onRemove 没有触发说明当列表中的拖拽数据有增加和减少的时候才会发生该事件，当然如果有兴趣的朋友可以看看他生事件的顺序和条件。
还有传递一个evt参数，我们看看该参数有些什么东西。主要看_dispatchEvent 这个函数改函数的功能是:创建一个事件，事件参数主要由name 提供，并且触发该事件，其实就是模拟事件并且触发该事件。
看看改函数的关键源码
var evt = document.createEvent('Event'),   //创建一个事件
           options = (sortable || rootEl[expando]).options,   //获取options 参数
           //name.charAt(0) 获取name的第一个字符串
           //toUpperCase() 变成大写
           //name.substr(1) 提取从索引为1下标到字符串的结束位置的字符串
           //onName 将获得 on+首个字母大写+name从第一个下标获取到的字符串
       onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1);

       evt.initEvent(name, true, true); //自定义一个事件

       evt.to = rootEl; //在触发该事件发生evt的时候，将evt添加多一个to属性，值为rootEl
       evt.from = fromEl || rootEl; //在触发该事件发生evt的时候，将evt添加多一个to属性，值为rootEl
       evt.item = targetEl || rootEl; //在触发该事件发生evt的时候，将evt添加多一个to属性，值为rootEl
       evt.clone = cloneEl;   //在触发该事件发生evt的时候，将evt添加多一个to属性，值为rootEl

       evt.oldIndex = startIndex; //开始拖拽节点
       evt.newIndex = newIndex; //现在节点
        //触发该事件，并且是在rootEl 节点上面。触发事件接口就这这里了。onAdd: onUpdate: onRemove:onStart:onSort:onEnd:

接下来事件有了，我们怎么做排序呢？其实很简单，只要我们做排序的列表中加一个drag-id就可以，然后在拖拽过程中有几个事件onAdd， onUpdate，onRemove，onStart，onSort，onEnd，
然后我们不需要关心这么多事件，我们也不需要关心中间拖拽发生了什么事情。然后我们关心的是当拖拽结束之后我们只要调用onEnd事件就可以了然后改接口会提供 evt。 evt中可以有一个from就是拖列表的根节点
只要获取到改节点下面的字节的就可以获取到排序id。请看dome