`
dinghao93210
  • 浏览: 10903 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Js 动态增加 删除 select multiple 中的值

阅读更多
两个 multiple 相互传值:
function addSingleTableOption(src, dest)
     {
      var srcObj = document.getElementByIdx(src)
      var destObj = document.getElementByIdx(dest)
      var srcOpts = srcObj.options;
      var destOpts = destObj.options;
      var len = srcOpts.length;

      for (i = len - 1; i >= 0; i--)
      {
       if (srcOpts[i].selected)
       {
        var newOpt = new Option(srcOpts[i].text, srcOpts[i].value);
        destOpts.add(newOpt);
        srcOpts.remove(i);
       }
      }
      return;
     }

将一个文本框中的值赋值给 multiple :
        function addOption(){
      var value = document.getElementById("date").value;
      var destObj = document.getElementById("days");
      var destOpts = destObj.options;
      if (value.length > 0){
        var newOpt = new Option(value, value);
        destOpts.add(newOpt);
       }
     }
删除 multiple 中的值 :
for (i = len - 1; i >= 0; i--){
            destObj.remove(i);
        }
分享到:
评论

相关推荐

    layui多选下拉框样式,整套layui-select-multiple

    例如,你可以轻松地添加、删除选项,获取用户的选定值,以及设置默认选中项等。此外,Layui的多选下拉框还支持搜索功能,用户可以在下拉框内输入关键字快速筛选选项,大大提高了操作效率。 关于“取值”,在Layui的...

    解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题

    通过watch监听器来监控el-select绑定的值,当用户尝试删除一个不允许删除的选项时,通过监听函数将之前删除的选项重新添加到选中值中。虽然这种方法能够实现功能,但在界面上会存在误导用户的情况,因为在不允许...

    Select Multiple Values from Combobox Using JavaScript.zip

    在JavaScript编程中,选择多个值从组合框(ComboBox)是一种常见的交互需求,特别是在网页应用程序和游戏开发中。这个压缩包“Select Multiple Values from Combobox Using JavaScript.zip”很可能包含了一个简单的...

    Js操作Select大全(取值、设置选中等等)

    JavaScript(简称JS)是网页开发中不可或缺的一部分,尤其在处理用户界面交互方面具有重要作用。本文档将详细介绍如何利用原生JavaScript和jQuery来操作`<select>`元素,包括但不限于取值、设置选中状态等常见操作。...

    重构《实现select multiple左右添加和删除功能》

    在这个特定的案例中,“重构《实现select multiple左右添加和删除功能》”是一个关于如何优化多选下拉框(select multiple)操作的实践。该博文的作者通过提供一个名为`multipleSelect.html`的示例文件,展示了如何...

    js之Select用法

    在`select`标签中添加`multiple`属性,可以创建一个允许多选的下拉菜单。此时,`selectedIndex`会返回一个数组,`value`则会返回一个包含所有选中值的数组。 6. **禁用或启用`select`元素** 使用`disabled`属性...

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

    本实例展示了一个这样的功能:允许用户从左侧的选择框(结果集)中选择值,将这些值添加到右侧的选择框,同时在右侧删除选项时,值会返回到左侧的结果集中。这个功能对于数据管理和用户交互来说非常实用。 在提供的...

    处理html 控件select的js函数

    JavaScript中的`document.getElementById`方法可以用来获取指定ID的`<select>`元素。然后,我们可以使用`options`属性来访问所有选项,并通过`selectedIndex`属性来获取或设置当前选中的选项索引。例如,`selectObj...

    JavaScript实现动态删除列表框值的方法

    在JavaScript中,动态删除列表框(Select元素)的值是一项常见的操作,特别是在处理用户交互或者动态更新页面内容时。在给定的示例中,它展示了如何通过JavaScript函数来删除列表框中的特定选项。以下是对这个方法的...

    多选select组件 涉及的所有常用操作

    动态添加或删除选项是多选select组件常见的操作。添加新选项: ```javascript var option = document.createElement('option'); option.value = 'newOption'; option.text = 'New Option'; select.appendChild...

    JS select标签复选

    此外,还可以使用 jQuery 实现其他高级功能,如动态添加或删除选项,禁用或启用选项,以及在用户提交表单时验证选择等。 在实际项目中,`downSelectS.zip` 压缩包可能包含了实现上述功能的 HTML、CSS 和 JS 文件。...

    Jquery实现的双Select框多选表单提交

    以上代码中,`e.preventDefault()`用于防止页面刷新,然后我们通过jQuery遍历两个Select框中的选中项,将值添加到数组`selectedValues`中。最后,这些值可以发送到服务器进行处理。 总结一下,本文介绍了如何使用...

    下拉框多选select多选

    在实际应用中,我们可能需要动态添加、删除选项,或者获取用户的选择。这可以通过JavaScript或jQuery来实现。例如,用jQuery添加一个选项: ```javascript $('select').append('<option value="value4">Option 4...

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

    在本文中,我们将探讨如何使用jQuery实现一个基本的多选下拉列表(select multiple)功能,允许用户在两个下拉列表之间添加和删除选项。这个功能常见于需要用户分配或移动项目的场景,如分配任务、选择角色等。下面...

    Element-ui中 选择器(select)多选下拉框实现全选功能.zip

    在Vue.js框架中,Element-UI是一个非常流行的前端组件库,它提供了丰富的UI元素和交互设计,大大简化了Web开发工作。在这个特定的场景中,我们关注的是Element-UI中的选择器组件——`<el-select>`,特别是如何实现...

    HTML Select 下拉菜单功能扩展

    4. **动态加载**:利用JavaScript,可以在用户交互时动态添加或删除选项,提高用户体验。 ```javascript var select = document.getElementById('mySelect'); var option = document.createElement('option'); ...

    下拉多选插件ySelect.js

    - **API接口**:可能提供一系列的API方法,用于动态添加、删除或修改选项,或者获取用户的选择状态。 - **兼容性**:作为jQuery插件,ySelect.js通常会兼容主流浏览器,确保在各种环境下都能稳定运行。 在压缩包中...

    combo-select-master.zip

    安装与使用Combo-Select插件,你需要先在项目中引入jQuery库,然后下载并引入`combo-select.js`和相应的CSS文件。在HTML中,将普通的`<select>`元素替换为`<input>`,并设置相应的属性以初始化插件。例如: ```html...

Global site tag (gtag.js) - Google Analytics