Jquery实现Div上下移动示例


Posted in Javascript onApril 23, 2014
$(this).ready(function() { 
$(".up").each(function() { 
$(this).click(function() { 
var $tr = $(this).parents("li"); 
if ($tr.index() != 0) { 
$tr.prev().before($tr); 
} 
}); 
}); 
var trLength = $(".down").length; 
$(".down").each(function() { 
$(this).click(function() { 
var $tr = $(this).parents("li"); 
if ($tr.index() != trLength) { 
$tr.next().after($tr); 
} 
}); 
}); 
$("a[name='up']").click(function() { 
if ($("input[name='rule']:checked").size() > 1) { 
alert("只能选择一项进行上下移操作!"); 
return; 
} 
$("input[name='rule']:checked").each(function() { 
var $div = $('#rule_' + $(this).val()); 
if ($div.index() != 0) { 
$div.prev().before($div); 
} 
}); 
}); 
$("a[name='down']").click(function() { 
if ($("input[name='rule']:checked").size() > 1) { 
alert("只能选择一项进行上下移操作!"); 
return; 
} 
$("input[name='rule']:checked").each(function() { 
var $div = $('#rule_' + $(this).val()); 
if ($('#rule_' + (parseInt($(this).val()) + 1)).html() != null) { 
$div.next().after($div); 
} 
}); 
}); 
});
Javascript 相关文章推荐
Prototype源码浅析 String部分(三)之HTML字符串处理
Jan 15 Javascript
使用jQuery实现验证上传图片的格式与大小
Dec 03 Javascript
jQuery过滤选择器用法分析
Feb 10 Javascript
javascript 动态创建表格的2种方法总结
Mar 04 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 Javascript
学习JavaScript设计模式(策略模式)
Nov 26 Javascript
AngularJS入门教程之双向绑定详解
Aug 18 Javascript
jquery拼接ajax 的json和字符串拼接的方法
Mar 11 Javascript
详解webpack+angular2开发环境搭建
Jun 28 Javascript
微信小程序分页加载的实例代码
Jul 11 Javascript
nuxt.js写项目时增加错误提示页面操作
Nov 05 Javascript
js回到页面指定位置的三种方式
Dec 17 Javascript
JQuery为页面Dom元素绑定事件及解除绑定方法
Apr 23 #Javascript
JQuery下拉框应用示例介绍
Apr 23 #Javascript
JQuery对表格进行操作的常用技巧总结
Apr 23 #Javascript
IE6已终止操作问题的2种情况及解决
Apr 23 #Javascript
三种检测iPhone/iPad设备方向的方法
Apr 23 #Javascript
JS使用getComputedStyle()方法获取CSS属性值
Apr 23 #Javascript
javascript数字时钟示例分享
Apr 23 #Javascript
You might like
全国FM电台频率大全 - 30 宁夏回族自治区
2020/03/11 无线电
学习php过程中的一些注意点的总结
2013/10/25 PHP
php字符串截取函数用法分析
2014/11/25 PHP
laravel 解决Validator使用中出现的问题
2019/10/25 PHP
统计出现最多的字符次数的js代码
2010/12/03 Javascript
HTML复选框和单选框 checkbox和radio事件介绍
2012/12/12 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
获取offsetTop和offsetLeft值的js代码(兼容)
2013/04/16 Javascript
jquery html动态生成select标签出问题的解决方法
2013/11/20 Javascript
js清理Word格式示例代码
2014/02/13 Javascript
在JavaScript中重写jQuery对象的方法实例教程
2014/08/25 Javascript
Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果
2016/05/27 Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
2016/09/04 Javascript
百度多文件异步上传控件webuploader基本用法解析
2016/11/07 Javascript
百度搜索框智能提示案例jsonp
2016/11/28 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
2017/01/21 Javascript
浅谈webpack组织模块的原理
2018/03/10 Javascript
django中使用vue.js的要点总结
2019/07/07 Javascript
python连接mysql并提交mysql事务示例
2014/03/05 Python
深入讲解Python函数中参数的使用及默认参数的陷阱
2016/03/13 Python
Python解析命令行读取参数之argparse模块
2019/07/26 Python
Django REST框架创建一个简单的Api实例讲解
2019/11/05 Python
python 中 .py文件 转 .pyd文件的操作
2021/03/04 Python
HTML5通过调用canvas对象的getContext()方法来获取绘图环境
2014/06/23 HTML / CSS
美体小铺加拿大官方网站:The Body Shop加拿大
2016/10/30 全球购物
Belvilla法国:休闲度假房屋出租
2020/10/03 全球购物
酒吧员工的岗位职责
2013/11/26 职场文书
个人现实表现材料
2014/02/04 职场文书
教师考核评语
2014/04/28 职场文书
董事长年会致辞
2015/07/29 职场文书
会计主管竞聘书
2015/09/15 职场文书
关于环保的广播稿
2015/12/17 职场文书
公安干警正风肃纪心得体会
2016/01/15 职场文书
Pygame Draw绘图函数的具体使用
2021/11/17 Python
Go本地测试解耦任务拆解及沟通详解Go本地测试的思路沟通的重要性总结
2022/06/21 Golang
Li list-style-image 图片垂直居中实现方法
2023/05/21 HTML / CSS