jQuery表行向下移动的实现方法

jQuery表行向下移动的实现方法
当我们在运行列表数据时,需要对数据进行调整,如上下直线、数据线设置,这些操作可以通过点击前面的按钮完成,并且具有动态效果简单,易于实现数据排序表。

运行效果图:
HTML

页面是一个简单的数据表,我们被放在数据行中,自顶向下定义了三个链接和三个类属性,我们用jQuery实现这些操作。

对位置信息的HTML5访问
2015-04-25
删除顶部位移
固定页脚顶部的CSS + cookie实现广告


jQuery

我们需要把jQuery库文件,然后将上下三大操作单击事件。采取上述举措为例,当点击,获得行的内容和TR的点击,然后确定排排第一,如果不是第一排,然后插入的行为以前的interchangeover前排达到目的。当然,我们可以将淡出效果()和()时的线,所以更积极的样子,否则移动过程中会闪烁。自上而下的运作过程是相似的,请看代码:

$(函数(){())
移动
值为$()。
up.click美元(函数(){()
var $ = $(this);
如果tr.index($()!= 0){
tr.fadeout美元()FadeIn();
tr.prev美元()之前($ TR);

}
});

var $;
VaR len = down.length美元;
down.click美元(函数(){()
var $ = $(this);
如果tr.index($()!=镜头- 1){
tr.fadeout美元()FadeIn();
tr.next美元(美元)后(TR);
}
});

var =;
top.click美元(函数(){()
var $ = $(this);
tr.fadeout美元()FadeIn();
$(表)。Prepend($ TR);
tr.css美元(颜色
});
});
当然,实际应用应该与你的项目结合起来,在操作上下、下、下完成,ajax和异步交互应该保证后台程序,整理数据真实背景记录,然后刷新会显示出新的结果,这篇文章不会对异步操作做详细的解释。

tag:方法电脑软件jquery

相关内容