`

jquery select 左边值选到右边 右边删除

 
阅读更多
<select multiple id="sel1" style="height:250px;">
    <option value="6">a</option>
    <option value="7">b</option>
    <option value="7">b</option>
    <option value="7">b</option>
    <option value="7">b</option>
</select> 
<select multiple id="sel2" style="height:250px;">

</select>

function toRight(sel1, sel2){
    $('#'+sel1+' option:selected').each(function(){
    $("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>").appendTo("#"+sel2+":not(:has(option[value="+$(this).val()+"]))");
});

}
	
function toRemove(sel1, sel2){
    var $removeOptions = $('#'+sel2+' option:selected');
    $removeOptions.remove();
}

 

分享到:
评论

相关推荐

    jquery select2组件

    **jQuery Select2组件详解** `jQuery Select2`是一款强大的、高度可定制的下拉选择框插件,它在原生HTML `&lt;select&gt;` 元素的基础上提供了丰富的功能和优秀的用户体验。这款组件广泛应用于网页开发中,使得传统的单选...

    Jquery获取Select标签的值

    除了获取 Select 标签的值之外,还可以通过 jQuery 来控制其他表单元素的行为,包括文本框、复选框、单选按钮等。 ##### 1. 文本框与文本区域 - **清空内容**:`$("#txt").val("");` - **填充内容**:`$("#txt")....

    jquery select插件带搜索框的下拉选择框代码

    在本文中,我们将深入探讨如何使用jQuery的"searchableSelect"插件来创建一个具有搜索功能的下拉选择框。这个插件对于那些需要在大量选项中快速查找和选择的项目非常有用,它大大提升了用户体验。 首先,让我们了解...

    jquery select 选中值设置左右select选择互换

    本话题聚焦于使用jQuery来实现两个select元素之间的选中值互换功能。这对于用户界面设计,尤其是在需要双向联动或者数据交换的场景下,是一个实用的功能。 首先,我们要了解HTML中的`&lt;select&gt;`元素。它是创建下拉...

    jquery select2

    为了解决这些问题,jQuery社区推出了一个强大的插件——jQuery Select2。Select2不仅提供了美观的界面,还增强了用户体验,特别是对于大型数据集的搜索功能,使得在下拉框中快速找到所需选项变得轻而易举。 一、...

    jquery根据name取得select选中的值实例(超简单)

    实例如下所示: &lt;select name=region[province] id= class=region valid&gt; 省、直辖市 北京市 &lt;/select&gt;...取得textarea的值 &lt;textarea id='address'&gt;&lt;/textarea &gt; $(#textare

    js从select1选择到select2 左边选择到右边(很好用)

    本教程将深入探讨如何利用JavaScript实现从一个`select`(select1)中选择选项并将其移动到另一个`select`(select2)的过程,这在需要对可选项目进行动态管理的场景中非常实用。 首先,我们需要在HTML中定义两个`...

    jquery获得select option值

    根据提供的文件信息,我们可以总结出一系列关于如何使用jQuery来获取不同类型的表单元素(如文本框、单选按钮、复选框以及下拉列表)的值的方法。下面将详细介绍这些方法及其应用场景。 ### 一、获取文本框(input ...

    jquery+select选中左侧项目移动到右侧

    本教程将详细讲解如何使用 jQuery 实现一个功能,即允许用户从左侧的 select 下拉框选择项目,并将其移动到右侧的 select 下拉框。 首先,我们需要在 HTML 页面中创建两个 select 元素,分别表示左侧和右侧的选择框...

    jquery实现select互斥联动

    在本示例中,我们将探讨如何使用jQuery实现“select”元素的互斥联动效果,这是一种常见的表单控件交互设计,常用于多级筛选或配置场景。 一、基本概念 1. jQuery:jQuery 是一个高效、简洁而易用的JavaScript库,...

    select2(jquery)插件下载

    **jQuery Select2插件详解** Select2是一款基于jQuery的增强型下拉选择框插件,它极大地改进了原生HTML `&lt;select&gt;` 元素的用户体验和功能。标题中的"select2(jquery)插件下载"指的是这个插件的获取途径,通常通过...

    用jquery获取select标签中选中的option值及文本的示例

    根据提供的文件信息,我们可以了解到如何使用jQuery来获取HTML中select标签的选中项(option)的值(value)和文本内容(text)。以下是详细的知识点: 1. 引入jQuery库:要使用jQuery操作DOM元素,必须先引入...

    jQuery Select下拉框美化特效.zip

    为了使用这个特效,开发者需要将jQuery库引入到网页中,然后引入特效的CSS和JS文件,并对页面中的Select元素应用特定的类名或者ID。通常,特效的JS代码会监听Select元素的事件,如打开、关闭、选择等,然后根据这些...

    jquery select日历选择器点击select框弹出日期选择器

    jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器 jquery select日历选择器点击select框弹出日期选择器

    jQuery select下拉框美化代码.zip

    5. **响应用户选择**:当用户点击自定义的选项时,更新选中的`&lt;select&gt;`元素的值,并可能有相应的反馈,如高亮当前选中项。 6. **兼容性处理**:确保在不同浏览器和设备上都能正常工作,可能需要针对某些特定浏览器...

    jquery select列表选择框选中美化效果源码

    接着,通过jQuery选择器定位到需要美化的`&lt;select&gt;`元素,并调用插件的初始化方法。例如,如果使用Select2插件,代码可能会像这样: ```html &lt;!DOCTYPE html&gt; &lt;title&gt;jQuery Select美化 &lt;link href="select2....

    jQuery获取Select选择的Text和_Value

    可以使用 `$("#select_id option[text='jQuery']").attr("selected", true)` 方法设置 Select 的 Text 值为 jQuery 的项选中。 三、 jQuery 添加/删除 Select 的 Option 项 jQuery 也提供了方法来添加或删除 ...

    jquery.selectbox.js select下拉菜单美化代码

    jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码 jquery.selectbox.js select下拉菜单美化代码

    [转]Jquery操作select 收藏

    如`$('select').val()`返回选中项的值,`$('select').val('newValue')`则将选中项设置为对应值的选项。 2. **添加和删除选项**:要动态添加选项,可以使用`.append()`方法。例如: ```javascript $('...

    jQuery手机下拉框select

    这个插件自动应用到页面中的所有`&lt;select&gt;`元素,无需额外的JavaScript代码。你可以通过以下方式引入jQuery Mobile库: ```html &lt;link rel="stylesheet" href="https://code.jquery....

Global site tag (gtag.js) - Google Analytics