sortable.js 华丽丽的排序
首先导入这几个资源
<link href="/css/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css" />
<script src="/js/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="/js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>
页面加载时执行
$("#sortable").sortable({
opacity:0.8,
revert:true,
forceHelperSize:true,
placeholder: 'draggable-placeholder',
forcePlaceholderSize:true,
tolerance:'pointer',
stop: function( event, ui ) {
//just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved
$(ui.item).css('z-index', 'auto');
$.post(
"/scheme/sortPointMenu",
{
keyList :$("#sortable").sortable('serialize'),
stageId:lvId
},
function(response){
}
);
}
});
sortable.js 华丽丽的排序的更多相关文章
- js实现table排序-sortable.js
方案一.引用sortable.js包 /* <th class="thcss" style="width: 40px;" onclick="so ...
- html5 Sortable.js 拖拽排序源码分析
最近公司项目经常用到一个拖拽 Sortable.js插件,所以有空的时候看了 Sortable.js 源码,总共1300多行这样,写的挺完美的. 本帖属于原创,转载请出名出处. 官网http:// ...
- 拖放排序插件Sortable.js 兼容好及功能全个人觉得比dragula.js 好的多
经测试,Sortable.js 兼容好和使用方便都是比较不错的,特别手机端使用很棒 介绍 Sortable.js是一款轻量级的拖放排序列表的js插件(虽然体积小,但是功能很强大)下载地址:https: ...
- html5支持drag的拖放排序插件sortable.js
html5支持drag的拖放排序插件sortable.js <script src="//cdnjs.cloudflare.com/ajax/libs/Sortable/1.5.1/S ...
- js 实现拖拽排序
<!DOCTYPE> <html lang="zh-cn"> <head> <meta http-equiv="Content- ...
- Sortable.js
拖拽的时候主要由这几个事件完成, ondragstart 事件:当拖拽元素开始被拖拽的时候触发的事件,此事件作用在被拖曳元素上 ondragenter 事件:当拖曳元素进入目标元素的时候触发的事件,此 ...
- sortable结合angularjs实现拖动排序
记录拖动排序 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
- 列拖拽顺序调整-sortable.js使用
最近在做一个单表统计功能,涉及到一个查询列配置,但是查询出来的列顺序,可以进行配置,通过写列的排序当然阔以,但是方法就不美丽了.所以,在网上搜了一下拖拽的组件,最终定位Sortable.js,简单易用 ...
- vuejs2.0使用Sortable.js实现的拖拽功能
简介 在使用vue1.x之前的版本的时候,页面中的拖拽功能,我在项目中是直接用的jquery ui中的sortable.js,只是在拖拽完成后,在update的回调函数中又重新排序了存放数据的数组.但 ...
随机推荐
- uva 10763 Foreign Exchange(排序比较)
题目连接:10763 Foreign Exchange 题目大意:给出交换学生的原先国家和所去的国家,交换成功的条件是如果A国给B国一个学生,对应的B国也必须给A国一个学生,否则就是交换失败. 解题思 ...
- python邮件发送脚本
转自:http://phinecos.cnblogs.com/ #!/usr/bin/python #coding=utf-8 #@author:dengyike #@date:2010-09-28 ...
- Javascript数组的声明
var cars=new Array(); cars[0]="Audi"; cars[1]="BMW"; cars[2]="Volvo"; ...
- BootStrap 智能表单系列 五 表单依赖插件处理
这一章比较简单哦,主要就是生产表单元素后的一些后续处理操作,比如日期插件的渲染.一些autocomplete的处理等,在回调里面处理就可以了, demo: $("input.date-pic ...
- 今天碰到的angular 中的一个小坑
最近在自个儿研究angular,在写一个demo的时候总是有问题,最后发现居然是大小写的问题,卧槽 特tm的坑爹了,代码如下: <!DOCTYPE html> <html lang= ...
- js调试若干
主要是将 chrome调试工具 firebug的控制台对以下都有支持 consoleAPI https://developers.google.com/chrome-developer-tools ...
- JavaEE学习之类加载器
类装载子系统 在JAVA虚拟机中,负责查找并装载类型的那部分被称为类装载子系统. JAVA虚拟机有两种类装载器:启动类装载器和用户自定义类装载器.前者是JAVA虚拟机实现的一部分,后者则是Java程序 ...
- 把复选框变成单选框(prop,attr的区别)
如果项目中需要统一样式的话,有可能会遇到把复选框变成单选框的需求. 下面是用jquery的简单实现 $(function(){ $("input[type='checkbox']" ...
- struts2上传下载
struts上传下载必须引入两个jar文件: commons-fileupload-x.x.x.jar和comons-io-x.x.x.jar上传文件 import java.io.BufferedI ...
- Qt容器类的对象模型及应用(线性结构篇)(好多图,比较清楚)
用Qt做过项目开发的人,肯定使用过诸如QList.QVector.QLinkList这样的模板容器类,它们虽然名字长的不同,但使用方法都大致相同, 因为其使用方法都大体相同,很多人可能随便拿一个容器类 ...