欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

jquery列表拖动排列(由项目提取相当好用)_jquery

程序员文章站 2022-04-02 21:04:49
...
代码一预览:
复制代码 代码如下:





最好的jquery列表拖动排列自定义拖动层排列









jQuery列表拖动排列演示



简单的一组列表:




  • 你猜

  • 你不猜

  • 你不猜你不猜

  • 猜猜

  • 你猜不猜

  • 你猜不猜不猜

  • 你不猜不猜







两组列表拖放:(无限组拖放)




  • 10

  • 11

  • 12

  • 13

  • 14

  • 15

  • 16

  • 17

  • 18




  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9






",
scrollSpeed: 5
});

function saveOrder() {
var data = $("#list1 li").map(function(){
return
$(this).children().html();
}).get();
$("input[name=list1SortOrder]").val(data.join("|"));
};




Usage


$("ul").dragsort({ dragSelector: "li", dragEnd: function() { }, dragBetween: false, placeHolderTemplate: "
  • " });




    dragSelector

    CSS选择器内的元素的列表项的拖动手柄。默认值是“li”。

    dragSelectorExclude

    CSS选择器的元素内的dragSelector不会触发dragsort的。默认值是"input, textarea, a[href]"。

    dragEnd

    拖动结束后将被调用的回调函数.

    dragBetween

    设置为“true”,如果你要启用多组列表之间拖动选定的列表。 默认值是false。

    placeHolderTemplate

    拖动列表的HTML部分。默认值是"
  • ".

  • scrollContainer

    CSS选择器的元素,作为滚动容器,例如溢出的div设置为自动。 默认值是“窗口“.

    scrollSpeed

    一个数字,它代表了速度,页面拖动某一项时,将滚动容器外,较高使用价值的是速度和较低的值是较慢的。 如果设置为"0"以禁用滚动。默认值是"5".