两个多选框(select)之间值的左右上下移动
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>两个多选框(select)之间值的左右上下移动</title>
</head>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script><script type="text/javascript">$(function () {$("#s1 option:first,#s2 option:first").attr("selected", true);$("#s1").dblclick(function () {var alloptions = $("#s1 option");var so = $("#s1 option:selected");if (so === null || so == "undefined") {return;}try {var a = (so.get(so.length - 1).index == alloptions.length - 1) ? so.prev().attr("selected", true) : so.next().attr("selected", true);} catch (e) {return;}$("#s2").append(so);});$("#s2").dblclick(function () {var alloptions = $("#s2 option");var so = $("#s2 option:selected");if (so === null || so == "undefined") {return;}try {var a = (so.get(so.length - 1).index == alloptions.length - 1) ? so.prev().attr("selected", true) : so.next().attr("selected", true);} catch (e) {return;}$("#s1").append(so);});$("#add").click(function () {var alloptions = $("#s1 option");var so = $("#s1 option:selected");var a = (so.get(so.length - 1).index == alloptions.length - 1) ? so.prev().attr("selected", true) : so.next().attr("selected", true);$("#s2").append(so);});$("#remove").click(function () {var alloptions = $("#s2 option");var so = $("#s2 option:selected");var a = (so.get(so.length - 1).index == alloptions.length - 1) ? so.prev().attr("selected", true) : so.next().attr("selected", true);$("#s1").append(so);});$("#addall").click(function () {$("#s2").append($("#s1 option").attr("selected", true));});$("#removeall").click(function () {$("#s1").append($("#s2 option").attr("selected", true));});$("#s1up").click(function () {var so = $("#s1 option:selected");if (so.get(0).index !== 0) {so.each(function () {$(this).prev().before($(this));});}});$("#s1down").click(function () {var alloptions = $("#s1 option");var so = $("#s1 option:selected");if (so.get(so.length - 1).index != alloptions.length - 1) {for (i = so.length - 1; i >= 0; i = 1 - 1) {var item = $(so.get(i));item.insertAfter(item.next());}}});$("#s2up").click(function () {var so = $("#s2 option:selected");if (so.get(0).index !== 0) {so.each(function () {$(this).prev().before($(this));});}});$("#s2down").click(function () {var alloptions = $("#s2 option");var so = $("#s2 option:selected");if (so.get(so.length - 1).index != alloptions.length - 1) {for (i = so.length - 1; i >= 0; i--) {var item = $(so.get(i));item.insertAfter(item.next());}}});});</script><table width="600" border="0" cellpadding="0" cellspacing="0"><tr><td width="100"><select name="s1" size="10" multiple="multiple" id="s1" style=" width:200px" ,style="height:300px;"><option value="opt01">option01</option><option value="opt02">option02</option><option value="opt03">option03</option><option value="opt04">option04</option><option value="opt05">option05</option><option value="opt06">option06</option><option value="opt07">option07</option><option value="opt08">option08</option><option value="opt09">option09</option><option value="opt10">option10</option></select></td><td width="37" align="center"><input type="button" name="addall" id="addall" value=">|"/><br/><input type="button" name="add" id="add" value=">>"/><br/><input type="button" name="remove" id="remove" value="<<"/><br/><input type="button" name="removeall" id="removeall" value="|<"/></td><td width="100"><select name="s2" size="10" multiple="multiple" id="s2" style=" width:200px height: 300px;"></select></td></tr>
</table></html>
相关文章：
两个多选框(select)之间值的左右上下移动
<!DOCTYPE html> <html> <head><meta charset"utf-8"><title>两个多选框(select)之间值的左右上下移动</title> </head> <script src"https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>&…...
【设计模式】——模板模式
什么是模板模式？ 模板方法模式（Template Method Pattern），又叫模板模式(Template Pattern)，在一个抽象类公开定义了执行它的方法的模板。它的子类可以按需要重写方法实现，但调用将以抽象类中定义的方式进行…...
工业机器视觉系统开发流程简介
需求分析和系统设计：与用户合作，明确系统的功能和性能需求，并设计系统的整体架构。 软、硬件选型：根据需求分析结果，选择适合的软、硬件设备，包括光学传感器、相机、光源、图像采集设备、处理器等。 软件…...
【Unity3D】Renderer Feature简介
1 3D 项目迁移到 URP 项目后出现的问题 3D 项目迁移至 URP 项目后，会出现很多渲染问题，如：材质显示异常、GL 渲染不显示、多 Pass 渲染异常、屏幕后处理异常等问题。下面将针对这些问题给出一些简单的解决方案。 URP 官方教程和 API 详见→Un…...
麻了！包含中科院TOP，共16本期刊被标记为“On Hold”状态！
近日，小编从科睿唯安旗下的“Master Journal List”官网查到，除了知名老牌期刊Chemosphere竟然被标记为“On Hold”状态，目前共有7本SCI期刊，1本SSCI期刊，8本ESCI期刊被标记为“On Hold”，究竟是怎么回事呢…...
2.Flink应用
2.1 数据流 DataStream：DataStream是Flink数据流的核心抽象，其上定义了对数据流的一系列操作DataStreamSource：DataStreamSource 是 DataStream 的 起 点 ， DataStreamSource 在StreamExecutionEnvironment 中 创 建 ，…...
Matlab进阶绘图第25期—三维密度散点图
三维密度散点图本质上是一种特征渲染的三维散点图，其颜色表示某一点所在区域的密度信息。 除了作图，三维密度散点图绘制的关键还在于密度的计算。 当然，不管是作图还是密度的计算，这些在《Matlab论文插图绘制模板》和《Matlab点…...
C++设计模式之桥接设计模式
文章目录 C桥接设计模式什么是桥接设计模式该模式有什么优缺点优点缺点 如何使用 C桥接设计模式 什么是桥接设计模式 桥接设计模式是一种结构型设计模式，它可以将抽象接口和实现分离开来，以便它们可以独立地变化和扩展。 该模式有什么优缺点 优点 灵…...
论文笔记：SUPERVISED CONTRASTIVE REGRESSION
2022arxiv的论文，没有中，但一作是P大图班本MIT博，可信度应该还是可以的 0 摘要 深度回归模型通常以端到端的方式进行学习，不明确尝试学习具有回归意识的表示。 它们的表示往往是分散的，未能捕捉回归任务的连续性质。…...
Java 多线程并发 CAS 技术详解
一、CAS概念和应用背景 CAS的作用和用途 CAS（Compare and Swap）是一种并发编程中常用的技术，用于解决多线程环境下的并发访问问题。CAS操作是一种原子操作，它可以提供线程安全性，避免了使用传统锁机制所带来的性能开…...
如何压缩高清PDF文件大小？将PDF文件压缩到最小的三个方法
PDF格式是一种非常常用的文档格式，但是有时候我们需要将PDF文件压缩为更小的大小以便于传输和存储。在本文中，我们将介绍三种PDF压缩的方法，包括在线PDF压缩、利用软件PDF压缩以及使用WPS缩小pdf。 首先，在线PDF压缩是最常用的方…...
04 统计语言模型（n元语言模型）
博客配套视频链接: https://space.bilibili.com/383551518?spm_id_from=333.1007.0.0 b 站直接看 配套 github 链接：https://github.com/nickchen121/Pre-training-language-model 配套博客链接：https://www.cnblogs.com/nickchen121/p/15105048.html 预训练 预先训练 我们…...
Linux各目录详解
Linux文件系统是一个树状结构，由多个目录（或文件夹）组成。以下是常见的Linux目录及其功能的详细解释： /（根目录）：在Linux文件系统中，所有其他目录和文件都是从根目录派生的。所有的存…...
【css】属性选择器分类
属性选择器类型示例说明[attribute][target]选择带有 target 属性的所有元素[attributevalue][target_blank]选择带有 target“_blank” 属性的所有元素[attribute~value][title~flower]选择带有包含 “flower” 一词的 title 属性的所有元素[attribute|value][lang|en]选择带有…...
备份容灾哪家好怎么样
数字化时代，数据安全是我们不容忽视的问题。云呐容灾备份系统不仅提供了强大的数据保护功能，而且操作简单，使用方便。无论你是企业管理员，还是个人用户，都可以轻松上手。它还提供了丰富的报告和监控功能，让…...
【前端实习生备战秋招】—HTML 和 CSS面试题总结（三）
【前端实习生备战秋招】—HTML 和 CSS面试题总结（三） 1.行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？ CSS 规范规定，每个元素都有 display 属性，确定该元素的类型，每个元素…...
Ansible Rsync 使用Ansible Rsync模块进行文件传输
在Ansible自动化工具中，Rsync模块（Rsync Module）是一个强大的组件，用于在Ansible控制节点和目标主机之间进行文件传输和同步。本文将深入探讨Ansible Rsync模块，了解它如何成为自动化任务中高效同步的自动化利器。 Ans…...
Eclipse如何自动添加作者、日期等注释
一、创建类时自动添加注释 1、Window->Preferences 2、Java->Code Syle->Code Templates->Code->New Java files->Edit->要添加的注释->Apply 二、选中要添加的类或者方法通过AltShiftJ快捷键添加 1、Window->Preferences 2、Java->Code Syle…...
uniapp返回
// 监听返回事件onNavigationBarButtonTap() {uni.showModal({title: 提示,content: 确定要返回吗？,success: (res) > {if (res.confirm) {uni.navigateBack({delta: 2})}}})},...
【Antd】antd form表单的rules文案无法跟随状态重渲染的原因及解决办法
问题背景 我有两个表单项，当我选择出库类型，调用onChange改变inOutType 状态，这时候发现这句代码不生效： rules{[{ required: true, message: 请选择${inOutType 1 ? 持有人 : 负责人} }]}示例代码 <TypographyForm.Group…...
咱就说中小厂房、仓库的火灾报警系统，用S7-200 PLC加组态王真的是性价比天花板——够稳定、好上手，成本还低，完全满足日常需求
基于S7-200 PLC和组态王火灾报警控制系统 我们主要的后发送的产品有，带解释的梯形图接线图原理图图纸，io分配，组态画面咱先从最基础的IO分配说起，直接给大家上我常用的分配表（都是经过3个项目验证的，靠谱…...
MQTT通信中的QoS级别详解：SpringBoot如何选择最适合的传输质量？
MQTT通信中的QoS级别详解：SpringBoot如何选择最适合的传输质量？ 在物联网和分布式系统架构中，消息传输的可靠性往往直接关系到业务逻辑的正确性。MQTT协议作为轻量级发布/订阅模式的通信标准，其QoS（服务质量࿰…...
别再手动拖拽了！用Mermaid语法+draw.io，5分钟搞定系统设计流程图
从文本到图表：Mermaid与draw.io的高效设计工作流革命 每次系统设计会议后，你是否也经历过这样的场景：白板上密密麻麻的逻辑草图需要转化为电子版，而传统拖拽式绘图工具让你在调整箭头和对齐方框上耗费半小时？作为经历…...
如何用Electron打造全平台视频播放神器：zyfun跨平台开发实战指南
如何用Electron打造全平台视频播放神器：zyfun跨平台开发实战指南 【免费下载链接】zyfun 跨平台桌面端视频资源播放器,免费高颜值. 项目地址: https://gitcode.com/gh_mirrors/zy/zyfun 在当今多设备、多系统的数字时代，一款真正优秀的视频播放器…...
ES启动失败：深入解析No buffer space available错误及连接数优化策略
1. 当ES启动失败时发生了什么 第一次看到"No buffer space available"这个报错时，我也是一头雾水。那天凌晨三点，线上监控突然报警，ES集群集体罢工，整个搜索服务直接瘫痪。查看日志发现满屏都是"java.net.SocketE…...
避坑指南：如何在torch 2.4.0 + CUDA 12.1环境下成功安装llamafactory及其依赖
深度避坑：PyTorch 2.4.0与CUDA 12.1环境下的Llamafactory全栈部署实战 当开发者尝试在PyTorch 2.4.0和CUDA 12.1环境下部署Llamafactory时，往往会陷入依赖地狱——从Torch版本误装到vllm模块缺失，每个环节都可能成为耗时数小时的深坑。本文将…...
探索Unity全功能的开源方案：UniHacker跨平台功能扩展工具深度指南
探索Unity全功能的开源方案：UniHacker跨平台功能扩展工具深度指南 【免费下载链接】UniHacker 为Windows、MacOS、Linux和Docker修补所有版本的Unity3D和UnityHub 项目地址: https://gitcode.com/GitHub_Trending/un/UniHacker Unity作为游戏开发领域的行业标…...
ms-swift微调框架入门：快速掌握LoRA微调与模型合并技巧
ms-swift微调框架入门：快速掌握LoRA微调与模型合并技巧 1. 引言 在当今大模型技术快速发展的背景下，如何高效地对大型语言模型进行微调成为了许多开发者和研究者的关注焦点。ms-swift作为一款强大的微调框架，提供了丰富的功能和技术支持&am…...
告别卡顿！用UE5关卡流送（Level Streaming）优化你的开放世界游戏性能
告别卡顿！用UE5关卡流送（Level Streaming）优化你的开放世界游戏性能 当玩家在广袤的开放世界中自由探索时，没有什么比突然的加载卡顿或帧率骤降更能破坏沉浸感了。作为UE5开发者，我们常常面临一个两难选择：…...
为ROS开发准备：在拯救者Y7000上搭建Win11+Ubuntu22.04双系统全流程
拯救者Y7000 Win11与Ubuntu22.04双系统配置：ROS开发环境搭建实战手册 在机器人操作系统（ROS）开发领域，稳定的Linux环境是必不可少的基石。对于使用拯救者Y7000这类高性能笔记本的开发者而言，如何在保留Windows11系统的…...