我如何删除或禁用select2中的项目

时间:2019-07-18 03:09:59

标签: javascript jquery-select2

嗨,我想在我的value(x) = 1上删除或禁用select2的第一项。我怎样才能做到这一点? 谢谢。

var myData= [
    {
        id: "id1",
        text: 'aaaaa'
    }, {
        id: "id2",
        text: 'bbbbb'
    }
            ];


var x=0;
if (x == '1') {
    $('.select2 option[value="' + myData[0]+ '"]').remove()
}

2 个答案:

答案 0 :(得分:0)

我假设您正在使用jQuery select2,并且正在从myData创建select2元素。

如果您的数据是真相的来源,则可以通过这种方式进行更新,并在DOM中反映该状态(您所看到的)。

使用.shift()。从数据数组中删除第一个元素。

然后使用新数据重新初始化select2元素。像这样(下面的完整工作代码):

// condition > do something to select2 element's data
if (true) {
  // remove first data item from array
  myData.shift();

  // empty select2 element's data and re-init
  $(".select2").empty();
  $(".select2").select2({
    data: myData
  });
}

您可以运行它来查看它的工作。应用条件后,仅保留myData中的第二个数据项。

如果这可以解决您的问题,请接受答案:)

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/css/select2.min.css" rel="stylesheet"
/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>

<select class="select2"> </select>

<script>
  $(document).ready(function() {
    // data
    var myData = [
      {
        id: "id1",
        text: "aaaaa"
      },
      {
        id: "id2",
        text: "bbbbb"
      }
    ];

    // your select2 element already exists
    $(".select2").select2({
      data: myData
    });

    // condition > do something to select2 element's data
    if (true) {
      // remove first data item from array
      myData.shift();

      // empty select2 element's data and re-init
      $(".select2").empty();
      $(".select2").select2({
        data: myData
      });
    }
  });
</script>

MDN开始:shift()方法从数组中删除第一个元素,并返回删除的元素。此方法更改数组的长度。

答案 1 :(得分:0)

<select name="carlist" form="carform">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

如果要从选择选项中删除沃尔沃,请使用此

$("select option[value='volvo']").remove()