转自:http://www.itokit.com/2014/0820/75058.html

我们在编辑页面元素排序的时候,我推荐使用jquery插件:dragsort
dragsort官网地址:http://dragsort.codeplex.com/
在编写网页的时候,有时可能需要对ul的li进行排序,今天就给大家推荐使用jquery插件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列表拖动排列-jquery list dragsort插件参数和使用方法的更多相关文章

  1. jQuery列表拖动排列-jquery list dragsort插件参数和使用方法

    在编写网页的时候,有时可能需要对ul的li进行排序,今天就给大家推荐使用jquery插件jquery list dragsort实现列表拖动排序效果. 效果如图: jquery list dragso ...

  2. 最好用的jquery列表拖动排列(由项目提取)

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/wuchengzeng/article/details/31766235 最好的jquery列表拖动排 ...

  3. jquery 鼠标拖动排序Li或Table

    1.前端页面 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="拖动排序Li或Ta ...

  4. jQuery实现拖动布局并将排序结果保存到数据库

    很多网站的拖动布局的例子都是采用浏览器的COOKIE来记录用户拖动模块的位置,也就是说拖动后各模块的排序位置信息是记录在客户端的cookie里的.当用户清空客户端的cookie或浏览器的cookie过 ...

  5. jQuery手机触屏拖动滑块验证跳转插件

    HTML: <!DOCTYPE html> <html lang="en"> <head> <title>jQuery手机触屏拖动滑 ...

  6. jquery瀑布流排列样式代码

    <!DOCTYPE html><html><head lang="en"> <meta charset="gb2312" ...

  7. 基于jQuery图片自适应排列显示代码

    基于jQuery图片自适应排列显示代码.这是一款基于jquery.flex-images插件实现的类似谷歌图片流效果.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...

  8. jquery可拖动表格调整列格子的宽度大小(转)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. 基于JQuery可拖动列表格插件DataTables的踩坑记

    前言 最近项目中在使用能够拖动列调整列位置顺序的表格插件---DataTables,这也是目前我找到的唯一一种存在有这种功能的插件. 在查找使用方法的过程中发现可用案例并不多,且大多言语不详.本文将全 ...

随机推荐

  1. 百练_2409 Let it Bead(Polya定理)

    描述 "Let it Bead" company is located upstairs at 700 Cannery Row in Monterey, CA. As you ca ...

  2. WPF学习(一)控件的公共属性

    Visiblity控件是否可见:枚举类型:Visible表示可见.Collapsed不可见. IsEnabled:控件是否可用:bool类型. Background:背景色. FontSize:字体大 ...

  3. html引入外部的jswenjian

    首先看一下引入的方式是否正确 <script type='text/javascript' src='xx.js'></script> 其次看引入的路径是否正确 如果引入了第三 ...

  4. linux源码“.config”文件分析

    一..config文件概述 .config文件是linux内核配置文件,当执行#make uImage编译生成内核时,顶层的Makefile会读取.config文件的内容,根据这个配置文件来编译所定制 ...

  5. typedef与define

    一.typedef用法 typedef常用来定义一个标识符及关键字的别名,它生效是在语言编译过程,但它并不实际分配内存空间.typedef可以增强程序的可读性,以及标识符的灵活性,但它也有“非直观性” ...

  6. SqlHelper 帮助文档及详解--项目初步搭建

    微软SqlHelper类中文注释和使用方法 相关链接: http://blog.csdn.net/itmaxin/article/details/7609566 SqlHelper.cs是N年前微软出 ...

  7. css详解笔记

    CSS中的块级元素与行内元素 块级元素特性: 1.占据一整行,总是重起一行并且后面的元素也必须另起一行显示. 2.内联元素特性: 3.和其他内联元素显示在同一行. 块级元素列举如下: div(文档分区 ...

  8. Apriori算法在购物篮分析中的运用

    购物篮分析是一个很经典的数据挖掘案例,运用到了Apriori算法.下面从网上下载的一超市某月份的数据库,利用Apriori算法进行管理分析.例子使用Python+MongoDB 处理过程1 数据建模( ...

  9. Javascript异步编程的4种方法(转载)

    原博地址: http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.html

  10. SSL交互和握手过程

    SSL消息按如下顺序发送:  1.Client Hello  客户发送服务器信息,包括它所支持的密码组.密码组中有密码算法和钥匙大小: 2.Server Hello  服务器选择客户和服务器都支持的密 ...