左右选择按钮

MingL520

于 2016-11-15 16:35:26 发布

阅读量1k

点赞数 1

分类专栏：前端最新面试题以及日常实用插件文章标签： html 左右选择

本文链接：https://blog.youkuaiyun.com/MingL520/article/details/53172927

版权

前端最新面试题以及日常实用插件专栏收录该内容

44 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

这是一个HTML页面，展示了如何使用jQuery实现左右选择的功能。页面包含两个选择列表，用户可以选择左侧列表中的项并将其移动到右侧，或者反之。通过单击按钮可以实现单个或全部选项的转移，同时双击选项也能实现快速移动。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">

<title>双列表</title>

<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>

</head>

<style>
/* CSS Document */
* { padding:0; margin:0;}
body { font-size:12px; padding:100px;}
select { width:100px; height:167px; padding:5px;}
.content { float:left; text-align:center; margin-right:10px;}
span { display:block; width:100px; background:#eee; cursor:pointer; border:1px solid #ccc; padding:5px 0; margin:5px 0;}