jq 实现上下排序的一段代码
前台页面:
<div class="adddaren_box">
{%if isset($masterDetailsInfo)%}
<div class="adddaren_box1">
删除/修改达人列表
</div>
<input type="hidden" value="{%$masterDetailsInfo->getMasterId()%}" id="master_id">
<div class="adddaren_box2">
用户名
<input type="text" readOnly="true" value="{%$masterDetailsInfo->getUserName()%}" class="adddaren_box2_inp" />
</div>
<div class="adddaren_box3">
推荐理由
<input type="text" value="{%$masterDetailsInfo->getMasterInfo()%}" class="adddaren_box3_inp" />
</div>
<div class="adddaren_box4">
推荐时间
<input type="text" value="{%$masterDetailsInfo->getStartTime()%}" class="adddaren_box4_inp" />
</div>
<div class="adddaren_box5">
结束时间
<input type="text" value="{%$masterDetailsInfo->getEndTime()%}" class="adddaren_box5_inp" />
</div>
<div class="adddaren_box6">
<div class="adddaren_box6_sp1" id="modify">修改</div>
<div class="adddaren_box6_sp2" id="del">删除</div>
</div>
{%else%}
<div class="adddaren_box1">
添加达人列表
</div>
<div class="adddaren_box2">
用户名
<input type="text" value="" class="adddaren_box2_inp" />
</div>
<div class="adddaren_box3">
推荐理由
<input type="text" value="" class="adddaren_box3_inp" />
</div>
<div class="adddaren_box4">
推荐时间
<input type="text" value="" class="adddaren_box4_inp" />
</div>
<div class="adddaren_box5">
结束时间 <input type="text" value="" class="adddaren_box5_inp" /> </div> <div class="adddaren_box6"> <div class="adddaren_box6_sp1" id="add">添加</div> </div> {%/if%}</div>{%script%}require.async('huanzhe_houtai:widget/adddaren/adddaren',function(adddaren){adddaren.run();}){%/script%}
js:
exports.run = function(){ $(function(){
var pages = require('common:widget/page/page'); $(".addbanner").click(function(){
location.href="/huanzhe_houtai/ad_guanli";
});
//排序用
var i=$(this).parents().index();
$(document).on("click", '#prev', function master_order(){
var current_obj = $(this).parent().parent().eq(i);
//alert(current_obj.attr('class'));
if(current_obj.attr('class') == 'data_list_row'){
//alert(1);
var current_id = $(this).data("id");
var current_order = $(this).data("order"); var up = current_obj.prev().children('.edition_box3_sp6');
var prev = up.children('#prev'); var prev_id = prev.data("id");
var prev_order = prev.data("order");
//alert('当前id:'+current_id);
//alert('上一条id'+prev_id);
if(!prev_id){
alert('亲,已经置顶了哟!');
}else{
$(".loading").show();
if(parseInt(current_order) != parseInt(prev_order)) {
$.get("/index.php/master/order_master",
{current_id: current_id,current_order: current_order,swap_id: prev_id, swap_order: prev_order},
function (data) {
console.log(data);
var cur = current_obj.children('.edition_box3_sp6').children('#prev');
var cur_next = current_obj.children('.edition_box3_sp6').children('#next'); cur.data({"order":prev_order});
cur_next.data({"order":prev_order}); prev.data({"order":current_order});
up.children('#next').data({"order":current_order});
current_obj.prev().before(current_obj);
$(".loading").hide();
},'html');
} }
}
}); $(document).on("click", '#next', function master_order(){
var current_obj = $(this).parent().parent().eq(i); //alert(current_obj.attr('class')); if(current_obj.attr('class') == 'data_list_row'){ //alert(1); var current_id = $(this).data("id"); var current_order = $(this).data("order"); var down = current_obj.next().children('.edition_box3_sp6'); var next = down.children('#next'); var next_id = next.data("id"); var next_order = next.data("order"); if(!next_id){ alert('亲,已经到底了!'); }else{ $(".loading").show(); if(parseInt(current_order) != parseInt(next_order)) { $.get("/index.php/master/order_master", {current_id: current_id,current_order: current_order,swap_id: next_id, swap_order: next_order}, function (data) { console.log(data); var cur = current_obj.children('.edition_box3_sp6').children('#prev'); var cur_next = current_obj.children('.edition_box3_sp6').children('#next'); cur.data({"order":next_order}); cur_next.data({"order":next_order}); // alert(next_order); next.data({"order":current_order}); down.children('#prev').data({"order":current_order}); //alert(current_order); current_obj.next().after(current_obj); $(".loading").hide(); },'html'); } } } }); //这里是分页用的 pages.setCallback(function(page,page_size) { $(".loading").show(); console.log(page+','+page_size); //var param = $('.notice_param').val(); $.get("/index.php/master/load_master_page_list",{"page":page,"page_size":page_size},function(data){ console.log(data); //$(".InitPHP_pages").replaceWith(data); //$(data).replaceAll('.edition_box3'); $(".InitPHP_pages").remove(); $(".edition_box3").remove(); $(".edition_box2").after(data); $(".loading").hide(); },'html'); }); });};
jq 实现上下排序的一段代码的更多相关文章
- 由一段代码谈前端js优化和编码规范(一) 分类: JavaScript 2015-03-21 12:43 668人阅读 评论(1) 收藏
这段代码是撸主刚毕业那会写的,主要是实现一个左侧的导航条的折叠功能.当时实现的比较简陋,每次在导航条增加新的项目的时候,都要手动去修改js代码中写死的索引...确实是比较恼火的,后来就修改了一下,能够 ...
- C语言归并排序(合并排序)算法及代码
归并排序也称合并排序,其算法思想是将待排序序列分为两部分,依次对分得的两个部分再次使用归并排序,之后再对其进行合并.仅从算法思想上了解归并排序会觉得很抽象,接下来就以对序列A[0], A[l]…, A ...
- springboot工程启动即执行一段代码
最近在做一个项目, 需要Tomcat启动后就执行一段代码 在这里需要用到CommandLineRunner这个接口, Spring boot的CommandLineRunner接口主要用于实现在应用初 ...
- VBA_50段代码总结
'' 30个有用的VBA代码 '目录: '1--合理使用数组:'2--一次保存并关闭所 ...
- 评《撸一段 SQL ? 还是撸一段代码? 》
最近看到一篇博客<撸一段 SQL ? 还是撸一段代码?>,文章举例说明了一个连表查询使用程序code来写可读性可维护性更好,但是回帖意见不一致,我想作者在理论层面没有做出更好的论述,而我今 ...
- Unity 延迟执行一段代码的较为优雅的方式
在Unity中,延时执行一段代码或者一个方法或者几个方法的情况非常普遍. 一般会用到Invoke和InvokeRepeating方法.顾名思义,第一个是执行一次,第二个是重复执行. 看下定义: voi ...
- μC/OS-Ⅲ中的临界段代码
临界段代码(critical sections),也叫临界区(critical region),是指那些必须完整连续运行,不可被打断的代码段.μC/OS-Ⅲ系统中存在大量临界段代码.采用两种方式对临界 ...
- JavaScript-navigator_userAgent-编写一段代码能够区分浏览器的主流和区分
1 userAgent:包含浏览器名称和版本号的字符串 <!DOCTYPE html> <html> <head lang="en"> < ...
- Python实现装饰模式的一段代码
# 实现装饰模式的一段代码 import functools def log(func): @functools.wraps(func) def wrapper(*args,**kw): print( ...
随机推荐
- Html5shiv
说明编辑 越来越多的站点开始使用 HTML5 标签.但情况是还有很多人在使用IE6,IE7,IE8.为了让所有网站浏览者都能正常的访问网站, 2解决方案编辑 有下面两个: 为网站创建多套模板,通过程序 ...
- 优化 bulk insert
https://www.simple-talk.com/sql/learn-sql-server/bulk-inserts-via-tsql-in-sql-server/
- String相关的问题
基本事实:对于字符串常量,如果内容相同,Java认为它们代表同一个String对象.而用关键字new 调用的构造器,总是会创建新的对象,无论内容是否相同.字符串常量是放在常量池(或者叫常量缓冲区)里面 ...
- EditPlus 3.7 中文版已经发布
新一版的 EditPlus 已经在昨天发布了!新版本增加了一个 64位版程序.大家可以到官方网站下载哦. 我同步更新翻译了 32位版应用程序.请点击页面左上角的链接下载.
- 下载最新版本的Oracle Database
直接访问Oracle的官网就可以找到,鉴于Oracle经常改到下载面也我这里直接粘贴下载地址 http://www.oracle.com/technetwork/database/enterprise ...
- jeesz源码下载
大型分布式企业架构 jeesz,百度去搜索jeesz
- Dynamics AX 2012 R2 AIF No Endpoint Behavior Named 'clientEndpointBehavior'
最近,Reinhard在使用Http Adapter类型的AIF入站端口时,总是报以下错误: Server Error in '/MicrosoftDynamicsAXAif60' App ...
- Solution for Error FRM-92095: Oracle Jnitiator version too low
Solution for Error FRM-92095: Oracle Jnitiator version too low By Pan.Tian on 六月 04, 2013 Symtom: Af ...
- 小结一下前段时间做的rpgdemo
虽然说已经是彻底放弃继续做那个demo了(代码结构混乱,想增加新功能非常的不方便),不过还是花了一点心血在里面的,毕竟这是我开始学习unity游戏制作的初衷,不过果然是学的越多越发现自己的不足... ...
- mybatis foreach的使用
foreach标签在批量插入数据库时非常方便,但是很容易出错,我没有注意括号的位置让我折腾了一个半小时找问题,醉醉哒,所以在这里记录一下foreach的使用. 首先,这是insert批量插入正确的代码 ...