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 相关文章推荐
IE 缓存策略的BUG的解决方法
Jul 21 Javascript
JavaScript 解析读取XML文档 实例代码
Jul 07 Javascript
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
Dec 26 Javascript
Jquery实现图片左右自动滚动示例
Sep 25 Javascript
Javascript检查图片大小不要让大图片撑破页面
Nov 04 Javascript
js基于setTimeout与setInterval实现多线程
Jun 17 Javascript
jQuery动态创建元素以及追加节点的实现方法
Oct 20 Javascript
Vue中div contenteditable 的光标定位方法
Aug 25 Javascript
vue axios请求频繁时取消上一次请求的方法
Nov 10 Javascript
使用 Vue 实现一个虚拟列表的方法
Aug 20 Javascript
IntelliJ IDEA编辑器配置vue高亮显示
Sep 26 Javascript
JS如何定义用字符串拼接的变量
Jul 11 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
web方式ftp
2006/10/09 PHP
php下使用以下代码连接并测试
2008/04/09 PHP
PHP生成Flash动画的实现代码
2010/03/12 PHP
php getimagesize 上传图片的长度和宽度检测代码
2010/05/15 PHP
微信支付开发交易通知实例
2016/07/12 PHP
PHP图形计数器程序显示网站用户浏览量
2016/07/20 PHP
重定向实现代码
2006/11/20 Javascript
jquery 插件 人性化的消息显示
2008/01/21 Javascript
jQuery 动态酷效果实现总结
2009/12/27 Javascript
JavaScript 通过模式匹配实现重载
2010/08/12 Javascript
JavaScript的递归之递归与循环示例介绍
2013/08/05 Javascript
jquery操作下拉列表、文本框、复选框、单选框集合(收藏)
2014/01/08 Javascript
jQuery中ajax的load()方法用法实例
2014/12/26 Javascript
Javascript实现颜色rgb与16进制转换的方法
2015/04/18 Javascript
node.js使用cluster实现多进程
2016/03/17 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
2016/06/20 Javascript
原生js封装运动框架的示例讲解
2017/10/01 Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
2017/11/30 Javascript
jquery中done和then的区别(详解)
2017/12/19 jQuery
jQuery EasyUI window窗口使用实例代码
2017/12/25 jQuery
Android 自定义view仿微信相机单击拍照长按录视频按钮
2019/07/19 Javascript
详解Django的model查询操作与查询性能优化
2018/10/16 Python
Django forms表单 select下拉框的传值实例
2019/07/19 Python
django-初始配置(纯手写)详解
2019/07/30 Python
python 实现单通道转3通道
2019/12/03 Python
你可能不知道的Python 技巧小结
2020/01/29 Python
HTML5 LocalStorage 本地存储详细概括(多图)
2017/08/18 HTML / CSS
机电一体化专业应届本科生求职信
2013/09/27 职场文书
电子商务专业在校生实习自我鉴定
2013/09/29 职场文书
应届大学生自荐信
2013/12/05 职场文书
办加油卡单位介绍信
2014/01/09 职场文书
医院总经理岗位职责
2014/02/04 职场文书
2016年第104个国际护士节活动总结
2016/04/06 职场文书
文案策划岗位个人自我评价(范文)
2019/08/08 职场文书
导游词之青城山景区
2019/09/27 职场文书
浅析JavaScript中的变量提升
2022/06/01 Javascript