首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

正在删除select2中的选定项,不更新val()

在删除select2中的选定项时,我们需要执行以下步骤:

  1. 获取select2的实例:首先,我们需要找到对应的select元素并将其转换为select2实例。可以使用$('#selectElementId').select2()方法获取select2实例。
  2. 获取选定项的值:通过select2实例的val()方法,可以获取当前选定项的值。例如,$('#selectElementId').val()将返回一个包含选定项值的数组。
  3. 删除选定项:使用select2实例的data()方法,我们可以获取当前所有选项的数据。然后,可以通过比较选项的值是否与要删除的值相等,来确定要删除的选项。一旦找到要删除的选项,可以使用select2实例的trigger('select2:unselect')方法将其从选定项中移除。

下面是一个示例代码:

代码语言:txt
复制
// 获取select2实例
var selectElement = $('#selectElementId').select2();

// 获取选定项的值
var selectedValues = selectElement.val();

// 遍历选定项的值
selectedValues.forEach(function(value) {
  // 获取选项的数据
  var optionData = selectElement.select2('data');
  
  // 查找要删除的选项
  var optionToDelete = optionData.find(function(option) {
    return option.id === value;
  });
  
  // 删除选项
  selectElement.trigger('select2:unselect', {
    data: optionToDelete
  });
});

这样,我们就成功地删除了select2中的选定项,并且不会更新val()。请注意,上述示例代码仅适用于单选或多选的情况,如果select元素是多选的,则需要使用$('#selectElementId').val()获取选定项的数组。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

新手编程1001问(2)

下拉框在前端设计中是一个很常用的列表控件。独立的下拉框要实现起来并不难。但是,有时候我们会遇到两个甚至多个下拉框需要联动的问题,这时候,页面的实现就不是一个简单的交互了。...因此,实现联动需要解决的问题关键在于,页面不刷新的情况下,能够根据上一个下拉框的值,获取下一个下拉框的列表数据,并更新到列表。...解决这个问题的关键方法分两步: 第一步:使用Ajax,页面不刷新,获取下一个下拉框的列表数据。 第二步:使用JQery,将Ajax获取的列表数据更新到指定的下拉框。...#Select2”).empty(); //先定义默认选项 ("").val("0").text("请选择...").appendTo( //再将Ajax拿到的数据更新到...set_val:$(“#Select1”.val()) }, success:function(data){ mydata = data; } }); //2-将Ajax获取的数据更新到

8K40
  • select2如何黏贴选择

    有时在使用select2插件时会遇到这种需求:一次性选择一些数据,然后根据这些数据自动选择相关项,我也遇到了这种需求并实现,这里简单讲讲我的做法: 1.首先我修改了select2的源码,增加了一个方法paste...并在AllowedMethod数组中添加自定义的方法 paste:function(items,selId){ var datas = this.opts.data; var values=[];...('data',values); } }, allowedMethods = ["findHighlightableChoices","paste","val", "destroy", "opened...paste方法,在paste方法中完成数据项的选择 //由于select2重载了select元素,真正操作都是操作的select2插件创建的元素,笔者定义的select2元素id为multiple-import-orgId...$(selId).select2('paste',items,selId); //selId为select2插件id }); 通过上面代码,相信都已经明白了其中的原理

    1.1K20

    SQL命令 SELECT(四)

    ORDER BY 子句 ORDER BY子句由ORDER BY关键字后面跟着一个选择项或一个以逗号分隔的项列表组成,该列表指定显示行的顺序。...下面的示例返回数据库中所有行的选定字段,并按年龄升序排列这些行: SELECT Home_State, Name, Age FROM Sample.Person ORDER BY Age SELECT...不在事务中的查询定义为READ UNCOMMITTED。 如果READ UNCOMMITTED,则SELECT返回数据的当前状态,包括未提交的正在进行的事务对数据所做的更改。...如果READ COMMITTED,则行为取决于SELECT语句的内容。 通常,在read committed模式下的SELECT语句只会返回对已提交数据的插入和更新更改。...已被正在进行的事务删除的数据行不会返回,即使这些删除尚未提交并可能回滚。

    1.4K30

    动态博客的后台定制

    搭建动态博客的初衷就是想随时随地,只要一个浏览器,就能更新博客。那么就需要一个后台来管理文章,包含文章编辑器,和各种表单控件。...Flask-Admin 原生支持这两种类型的属性输入框,但有以下不足: 基于 Select2 3.x,不支持自由输入的选择框(tags)。 无法动态添加不存在的项到数据库中。...在重载的QuerySelectField里,我们需要实现以下逻辑: 先寻找匹配的 model 对象,并绑定到form.data里(未重载之前的行为) 剩下的未匹配的选择项,为它们创建 model 对象,...最终效果如下: 美中不足 动态添加做好了,那么删除呢?想像一下这个使用场景,你修改文章,把一个标签删除了,这个标签已经没有任何文章使用,那你肯定不希望它再出现在标签列表里吧?...于是我们需要监听before_flush信号,检查当前session中的对象并做对应处理。

    54410

    select 遇到的坑

    str.split(",");     //改变原字符串,不创建新的数组,所以改变原字符串为数组,只需要    str.split(",");即可                1.2.2     数组转字符串...1.2.3     类似的splice()方法改变原数据,slice方法创建新的数据,不改变原数据      2、select中没有特定option选项,但是需要将此值设为默认值(业务需求)          ...2.1     概念性理解:select赋值(或者默认值)是建立在option选项存在的条件下(option中的value),没有某option,则该值无法被赋值           2.2     将该...3、使用select2插件,select框中需要设置互斥选项     (例如:当选择全部的时候,其他选项清空只有全部,当选择其他选项时,没有全部这个选项,即互斥。...或者说两者之间选择后选项(后面选择的项替代当前选项))            $('#areaItem').on('change', function() { // select 改变事件

    1.1K100

    学习jQuery?这篇文章就够了

    虽然 jQuery 对象包装了 DOM 对象但是两者不能混用,各位可以理解为 jQuery 对象与 DOM 对象是两个不类型的对象,但是我们调用 jQuery 对象的方法,事实上底层代码还是操作的是 DOM...说明:这个标签是直接选择 HTML 代码中 class=”myClass” 的元素或元素组(因为在同一 HTML 页面 中 class 是可以存在多个同样值的元素)。...注意:是匹配之后的元素,不包含该元素在内,并且 siblings 匹配的是和 prev 同辈的元素,其后辈元 素不被匹配。...DOM 元素,过滤规则与 CSS 中的伪类选择器语法相同。...console.log(arr); // 遍历左边 select 中 option 获取其 value 值,跟上面数组中到对比,若存在,则删除 对应 option $(

    12.3K10

    js--数组方法

    03、shift()---删除数组第一个元素 04、pop()---删除数组最后一个元素 05、unshift()---在数组开头追加元素 06、push()---在数组末尾追加元素 07、reverse...()---翻转数组元素 08、sort()---数组排序 09、splice(start,deleteCount,val1,val2,...)...---新元素替换原来的元素,从start位置开始删除deleteCount项,并从该位置起插入val1,val2,... 10、slice(start,end)---从一个已有的数组中返回选定的元素,...返回从原数组中指定开始下标到结束下标之间的项组成的新数组 11、toString()----把数组转化成字符串 12、indexof()---返回某个指定的字符串值在数组中首次出现的位置。...13、lastIndexOf( )---返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。 ? ?

    1.6K10

    for 循环 和 Array 数组对象

    2 // 不改变原数组,过滤后返回新数组 3 // 回调函数的返回值:若 true:表示这一项放到新数组中 4 let newArr = [1,2,3,4,5].filter(item =...10 11 // map 映射,将原有的数组映射成一个新数组 [1,2,3],用于更新数组元素 12 // 不改变原数组,返回新数组 13 // 回调函数中返回什么这一项就是什么 14 //...=> val.name); 24 console.log(`newArrJson:${newArrJson}`); 25 26 27 28 29 // find:返回找到的那一项...71 // 不改变原数组 72 // 回调函数返回的结果: 73 // prev:数组的第一项,next是数组的第二项(下一项) 74 // 当前 return 的值是下一次的 prev 75...return prev.concat(next); // 拼接数组 103 }); 104 console.log(flat); 105 106 107 108 109 // slice 从已有的数组中返回选定的元素

    2.3K10

    R医学科研:R语言简介

    : function_name(arg1 = val1, arg2 = val2, ...)...运行脚本: Ctrl + Enter,没有选定行时,执行光标所在的一行; Ctrl + Enter,有选定的行时,执行选定的行; Ctrl + Shift + S,运行整个脚本。...不管是在控制台或者 R 脚本中创建的对象都被临时保存在工作空间(也可称为全局环境,.GlobalEnv)中。可以用函数ls()列出当前工作空间中的所有对象,或者使用rm()函数删除某个对象。...rm(list = ls())命令会删除当前工作空间中的所有对象。 退出 R 时,如果选择保存工作空间,R 将会在工作空间所有文件夹中创建两个新文件。...可以通过getwd()命令来得到当前的工作目录,也可以通过setwd()命令来设置工作目录,但通常不建议这么做,因为有更好的方法,即 RStudio 项目。

    86220

    yii2组件之下拉框带搜索功能的示例代码(yii-select2)

    ,可以参考下面的 use kartikselect2Select2; echo Select2::widget([ 'name' => 'title', 'data' => $data, 'options...' => ['placeholder' => '请选择...'] ]); 非ActiveFomr生成的更新数据的时候就需要默认选中,好办,加value值即可 use kartikselect2Select2...; echo Select2::widget([ 'name' => 'title', 'value' => 2, 'data' => $data, 'options' => ['placeholder...到此,我们已经可以唱者NB的歌欢快的回家了 等等,好像忘记什么了,有眼尖的小伙伴可能注意到了,$data都是我们预先准备好的数据,你说这数据量万一很大的情况,不搞死人了嘛,那接下来让我们看看如何实现异步搜索结果...来,上家伙,我们来看看如何使用异步搜索功能,工作中尤其是进行关联数据的时候其用途更是大大的,方便性嘛,看看就知道了,好用的不得了。

    1.1K20
    领券