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 相关文章推荐
js下通过getList函数实现分页效果的代码
Sep 17 Javascript
js怎么覆盖原有方法实现重写
Sep 04 Javascript
IE下使用jQuery重置iframe地址时内存泄露问题解决办法
Feb 05 Javascript
Jquery实现textarea根据文本内容自适应高度
Apr 03 Javascript
jQuery插件Validate实现自定义校验结果样式
Jan 18 Javascript
原生javascript 学习之js变量全面了解
Jul 14 Javascript
JavaScipt选取文档元素的方法(推荐)
Aug 05 Javascript
原生JS实现几个常用DOM操作API实例
Jan 19 Javascript
原生JS实现《别踩白块》游戏(兼容IE)
Feb 20 Javascript
js仿淘宝评价评分功能
Feb 28 Javascript
Node.js环境下Koa2添加travis ci持续集成工具的方法
Jun 19 Javascript
vue 项目@change多个参数传值多个事件的操作
Jan 29 Vue.js
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
php桌面中心(二) 数据库写入
2007/03/11 PHP
PHP的autoload机制的实现解析
2012/09/15 PHP
php获取一个变量的名字的方法
2014/09/05 PHP
10个简化PHP开发的工具
2014/12/25 PHP
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
弹出模态框modal的实现方法及实例
2017/09/19 PHP
显示js对象所有属性和方法的函数
2009/10/16 Javascript
JavaScript与Image加载事件(onload)、加载状态(complete)
2011/02/14 Javascript
iframe的onload在Chrome/Opera中执行两次Bug的解决方法
2011/03/17 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
2011/05/19 Javascript
实现动画效果核心方式的js代码
2013/09/27 Javascript
JS小功能(checkbox实现全选和全取消)实例代码
2013/11/28 Javascript
简单谈谈javascript代码复用模式
2015/01/28 Javascript
AngularJS constant和value区别详解
2017/02/28 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
利用NPM淘宝的node.js镜像加速nvm
2017/03/27 Javascript
jquery submit()不能提交表单的解决方法
2017/04/24 jQuery
详解Vue如何支持JSX语法
2017/11/10 Javascript
JavaScript简单实现的仿微博留言功能示例
2019/01/17 Javascript
python在windows下实现备份程序实例
2014/07/04 Python
在Python中操作列表之list.extend()方法的使用
2015/05/20 Python
python3实现字符串的全排列的方法(无重复字符)
2018/07/07 Python
python基于property()函数定义属性
2020/01/22 Python
Python 实现Image和Ndarray互相转换
2020/02/19 Python
CSS3 实现发光边框特效
2020/11/11 HTML / CSS
HTML5的新特性(1)
2016/03/03 HTML / CSS
html5组织内容_动力节点Java学院整理
2017/07/10 HTML / CSS
Html5百叶窗效果的示例代码
2017/12/11 HTML / CSS
美国眼镜网:GlassesUSA
2017/09/07 全球购物
幼儿园教师工作制度
2014/01/22 职场文书
幼儿园小班见习报告
2014/10/31 职场文书
党的群众路线教育实践活动个人对照检查材料(教师)
2014/11/04 职场文书
2014年学生资助工作总结
2014/12/18 职场文书
初三语文教学计划
2015/01/22 职场文书
来探秘“德国中小企业”的成功之道
2019/07/26 职场文书
导游词之崇武古城
2019/10/07 职场文书