jQuery实现select multiple左右添加和删除功能

项目要实现这样的一个功能(如下图所示):选择左边下拉列表框中的选项,点击添加按钮,把选择的选项 移动到右边的下拉列表框中,同样的选择右边的选项,点击删除按钮,即把选择的选项移动到左边的下拉列 表框中.相信用js很多朋友都写过,下面是我用jQuery来实现这样的功能的.具体代码如下:

下拉列表

<table width="95%" cellpadding="0" align="center" class="listshow" border="1" cellspacing="0">
<tr>
  <td colspan="4" align="center">选择分包</td>
  </tr>
<tr>
 <td class="black" width="30%" align="center" height="150">
       <select id="fb_list" multiple="multiple"  style="text-align:center;width:300px;height:150px;">
        </select>
    </td>
    <td align="center" width="5%">
    <input type="button" id="add" value="添加>>" />
      <br/>
      <br/>
      <input type="button" id="delete" value="<<删除 " />
    </td>
    <td class="black" width="30%" align="center">
    <select id="select_list" multiple="multiple" style=" text-align:center;width:300px;height:150px;">
      </select>
    </td>
</tr>
</table>

时间: 2024-09-20 00:19:46

jQuery实现select multiple左右添加和删除功能的相关文章

Jquery实现select multiple左右添加和删除功能的简单实例_jquery

项目要实现这样的一个功能(如下图所示):选择左边下拉列表框中的选项,点击添加按钮,把选择的选项移动到右边的下拉列表框中,同样的选择右边的选项,点击删除按钮,即把选择的选项移动到左边的下拉列表框中.相信用js很多朋友都写过,下面是我用jQuery来实现这样的功能的. 具体代码如下: <center> <table> <tr align="center"> <td colspan="3"> 选择 </td> &

两个多选select(multiple左右)添加、删除选项和取值实例_jquery

不知道怎么描述,就是有两个select下拉,做成文本域那样的,可以从一侧的结果集中选择值,添加到另一侧中:另一侧删掉后,值又重新到结果集那边了.直接看范例演示吧,相信你以前后者以后会用到的! 不多说了,上代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&

jQuery实现鼠标划过添加和删除class的方法

  本文实例讲述了jQuery实现鼠标划过添加和删除class的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 $('#elm').hover( function(){ $(this).addClass('hover') }, function(){ $(this).removeClass('hover') } ) 希望本文所述对大家的jQuery程序设计有所帮助.

jQuery实现鼠标划过添加和删除class的方法_jquery

本文实例讲述了jQuery实现鼠标划过添加和删除class的方法.分享给大家供大家参考.具体实现方法如下: $('#elm').hover( function(){ $(this).addClass('hover') }, function(){ $(this).removeClass('hover') } ) 希望本文所述对大家的jQuery程序设计有所帮助. 以上是小编为您精心准备的的内容,在的博客.问答.公众号.人物.课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery

jquery ext grid 实现动态添加,删除一行。急!!! 大神们求帮忙!10分

问题描述 jquery ext grid 实现动态添加,删除一行.急!!! 大神们求帮忙!10分 解决方案 Ext如何动态添加一行组件EXT增加删除一行 解决方案二: 添加http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.data.Store-method-add 删除,通过find找到记录,然后调用removehttp://docs.sencha.com/extjs/4.1.3/#!/api/Ext.data.Store-method-findhttp

利用jQuery来动态为属性添加或者删除属性的简单方法_jquery

现在做的项目有这样一个需要: 先看图吧^^   要求: 1.当点击导出Excel方式的时候,如果是"勾选导出"或"不分页导出"时,下面的文本框不能修改 2.当点击"分页导出"时,第一个文本框中的值可以被修改,但第二个文本框中的值不可以手动修改,但会随着第一个文本框中输入的值不断变化 实现: 这个页面我就不说怎么做的了,咱们看重点,如何来实现动态的增加属性值: function changeAttr(){ //onchange事件 添加和去除只读属

c#窗体-怎样在窗体里实现多张表的添加,删除功能。

问题描述 怎样在窗体里实现多张表的添加,删除功能. 用数据库建了几张表,也连接起来了,实现了查询功能,请问各位怎样实现添加,删除功能呢? 解决方案 http://www.cnblogs.com/myl0197/archive/2008/08/16/1269452.html

Android实现彩信附件的添加与删除功能_Android

本文实例讲述了Android实现彩信附件的添加与删除功能.分享给大家供大家参考,具体如下: 添加附件 在ComposeMessageActivity里 addAttachment(int type) 函数 根据type的不同,分成6个case case A: MediaSelectListActivity.ADD_IMAGE 用gallery选图片: MessageUtils.selectImage(this, REQUEST_CODE_ATTACH_IMAGE); 起一个intent: Int

Android实现彩信附件的添加与删除功能

本文实例讲述了Android实现彩信附件的添加与删除功能.分享给大家供大家参考,具体如下: 添加附件 在ComposeMessageActivity里 addAttachment(int type) 函数 根据type的不同,分成6个case case A: MediaSelectListActivity.ADD_IMAGE 用gallery选图片: MessageUtils.selectImage(this, REQUEST_CODE_ATTACH_IMAGE); 起一个intent: Int