jquery实现列表上下移动功能

前端之家收集整理的这篇文章主要介绍了jquery实现列表上下移动功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

废话少说,我们开始进入主题。 今天我们实现的是一个列表页面上移、下移功能。如图:

当勾选列表中的列时,点击上移或者下移,会动态上移或者下移。 HTML代码如下:

Box" id="c1"/>1Box" id="c2"/>2Box" id="c3"/>3

我们定义一个css样式叫做mytable

然后实现up(),down()方法既可,代码如下:

if ($(getUp).has("input").size()==0)
{
alert("顶级元素不能上移");
return;
}
$(onthis).after(getUp);
});
}
function down(){
$.each($("table input:checked"),function(){
var onthis=$(this).parent().parent();
var getdown=onthis.next();
$(getdown).after(onthis);
});
}

利用jquery提供的函数,实现很简单,当然如果想实现多列同时上移下移,只需要加一个循环既可,核心代码就是上边的。

以上就是本文的全部内容,希望对大家学习jquery程序设计有所帮助。

原文链接:https://www.f2er.com/jquery/49964.html

猜你在找的jQuery相关文章