Jquery list dragsort插件能对ul的li进行排序,实现列表拖动排序效果。
插件下载地址:http://dragsort.codeplex.com/
Demo地址: http://www.uedsc.com/wp-content/uploads/2014/04/jquery-list-dragsort/
jquery list dragsort列表拖动插件使用方法
$("ul").dragsort({ dragSelector: "li", dragEnd: function () { }, dragBetween: false, placeHolderTemplate: "<li></li>" });
jquery list dragsort列表拖动插件参数说明
dragSelector
CSS选择器内的元素的列表项的拖动手柄。默认值是“li”。
dragSelectorExclude
CSS选择器的元素内的dragSelector不会触发dragsort的。默认值是”input, textarea, a[href]“。
dragEnd
拖动结束后将被调用的回调函数.
dragBetween
设置为“true”,如果你要启用多组列表之间拖动选定的列表。 默认值是false。
placeHolderTemplate
拖动列表的HTML部分。默认值是”<li></li>”.
scrollContainer
CSS选择器的元素,作为滚动容器,例如溢出的div设置为自动。 默认值是“窗口“.
scrollSpeed
一个数字,它代表了速度,页面拖动某一项时,将滚动容器外,较高使用价值的是速度和较低的值是较慢的。 如果设置为”0″以禁用滚动。默认值是”5″.
相关推荐
首先,jQuery Dragsort插件包含了三个核心文件:`jquery.dragsort.min.js`、`jquery-list-dragsort.js`和`jquery.dragsort.js`。`jquery.dragsort.min.js`是该插件的压缩版,体积更小,加载速度更快,适用于生产环境...
本文将深入探讨“jQuery自由拖拽排序插件”,这是一种允许用户通过直观的拖放操作来自由调整元素顺序的功能。这个插件特别适用于创建可自定义排序的列表,如任务列表、菜单项或项目列表,为用户提供高度互动的界面...
`jQuery Dragsort` 是一个基于 jQuery 库的插件,它允许用户通过拖放操作来重新排序HTML列表元素,如`<ul>`或`<ol>`中的`<li>`元素。这个插件大大增强了用户体验,特别是在那些需要用户自定义顺序的场景下,如任务...
要实现列表项的拖动排序功能,可以使用jQuery库中的dragsort插件。以下是对如何使用jQuery实现列表拖动排列的具体知识点介绍。 首先,需要导入必要的JavaScript文件。这里使用到了jquery.dragsort.js,jquery....
7. **无限组拖放**:在示例中,我们还看到了一个带有ID`list2`的`<ul>`元素,它也具有`dragsort`类,这意味着用户可以在两个不同的列表之间进行拖放操作,实现了跨列表的无限组拖放功能。 8. **回调函数**:虽然...
在本实例中,我们探讨了如何使用jQuery库和一个名为jQuery Dragsort的插件来创建可拖动的DIV元素,并将它们的顺序保存到数据库。这个功能在需要用户自定义排序列表的应用场景中非常实用,例如在线内容管理、任务管理...
例如,`$("#list").dragSort();` 2. **监听事件**:插件内部会监听鼠标事件,如mousedown(鼠标按下)、mousemove(鼠标移动)和mouseup(鼠标释放)。当用户按下鼠标并在元素上移动时,开始拖拽操作。 3. **拖动...