jQuery下拉框的简单应用

先看看效果图：

大家肯定都见过类似效果的网页，怎么实现的呢,代码很简单：

* { margin:0; padding:0; }
div.centent {
  float:left;
  text-align: center;
  margin: 10px;
}
span { 
 display:block; 
 margin:2px 2px;
 padding:4px 10px; 
 background:#898989;
 cursor:pointer;
 font-size:12px;
 color:white;
}







 
 
  曹操
  曹昂
  曹丕
  曹彰
  曹植
  曹熊
  曹仁
  曹洪
  曹休
  曹真
  曹爽
 
 
  选中添加到右边>>
  全部添加到右边>>
 
 
 
 
  曹芳
 
 
  <<选中删除到左边
  <<全部删除到左边
 
 

代码实现的功能：
1)、将选中的选项添加给对方

2)、将全部选项添加给对方

3)、双击某个选项将其添加给对方

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。