技术频道

公众号推荐

微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦！

jquery实现列表上下移动功能

时间：2019-01-04分类：jQuery作者：编程之家

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

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

rush:xhtml;">

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

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

rush:css;"> .mytable td,.mytable{ font-size:12px; color:red; border:1px solid #000; text-align:center; border-collapse:collapse; }

然后实现up（），down（）方法既可，代码如下：

rush:js;"> $.each($("table input:checked"),function(){ var onthis=$(this).parent().parent(); var getUp=onthis.prev();

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.jb51.cc/jquery/49964.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

jquery列表上下移动功能 jquery列表上移 jquery列表下移

上一篇：jquery ztree实现树的搜索功能下一篇：jQuery实现从身份证号中获取出生日

相关推荐

jquery页面搜索关键词突出显示

页面搜索关键词突出 // 页面搜索关键词突出 $(function () { $(".list_r").find('span').css({ // 每次搜索开始，先把所有字体颜色恢复初始状态 'color': "#838792"

作者：今♀妃惜彼时间：2024-09-23

jQuery实时显示日期、时间

jQuery实时显示日期、时间 html: <span id="time"></span> js: <script src="Js/jquery.min.js"></script> <%--引用jQuery

作者：今♀妃惜彼时间：2024-09-23

jQuery 添加水印

jQuery 添加水印 <script src="../../../../AJs/jquery.min.js"></script> <script type="text/javascript"> $(document).re

作者：今♀妃惜彼时间：2024-09-23

Sys.WebForms.PageRequestManagerParserErrorException:无法分析从服务器收到的消息

中文：Sys.WebForms.PageRequestManagerParserErrorException:无法分析从服务器收到的消息，之所以出现此错误，常见的原因是：通过调用Response.Write()修改相应时，将启用响应筛选器、HttpModules或服务器追踪。详细信息：分析附近的“输

作者：今♀妃惜彼时间：2024-09-23

Asp.net 后台调用js方法

1. 用Response.Write方法代码如下： Response.Write("<script type='text/javascript'>alert("XXX");</script>"); 此方只能调用内部函数

作者：今♀妃惜彼时间：2024-09-23

Jquery实现按钮点击遮罩加载，处理完后恢复

Jquery实现按钮点击遮罩加载，处理完后恢复思路： 1.点击按钮调用OnClientClick事件，添加dom元素及样式。 2.当Click中逻辑执行完后，在Click中调用js方法删除掉刚才添加的dom元素。 1 <%@ Page Language="C#" Auto

作者：今♀妃惜彼时间：2024-09-23

.Net后台调用js，提示、打开新窗体、关闭当前窗体

.Net后台调用js，提示、关闭当前窗体、打开新窗体 Response.Write("<script>window.alert('支付成功!');window.open('/JkCommerce/" + href + "',&

作者：今♀妃惜彼时间：2024-09-23

.net 搜索联想词

思路： 1.ajax请求后台方法获取数据。 2.通过jquery将请求到的数据显示在页面上。前台 <div class="sc_con" id="bbsearch"> <input type="text" class=&

作者：今♀妃惜彼时间：2024-09-23

JS点击子元素不触发父元素点击事件(js阻止冒泡)

<html> <title></title> <head> <meta charset="utf-8"> <style type="text/css"> .divone{width:100

作者：今♀妃惜彼时间：2024-09-23

jQuery表单验证提交：前台验证一

jQuery表单验证提交：前台验证一（图文+视频）

作者：编程之家时间：2023-09-13

小编推荐

苹果市值2025年有望达4万亿美元