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

Question

Hi I want to delete or disable first item of my select2 when my value(x) = 1 . How can I do this? Thanks.

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


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

Answer 1

I'm assuming you're using jQuery select2 and you're creating your select2 element from myData .

If your data is a source of truth, you can do it this way to keep it updated and reflect that state in your DOM (what you see).

Use .shift() . to remove the first element from your data array.

Then re-init your select2 element with new data. Like this (full working code below):

// 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
  });
}

You can run this to see it working. After the conditional is applied, only the 2nd data item in myData remains.

If this solves your problem, let me know by accepting answer :)

 <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> 

From MDN : The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.

Answer 2

<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>

If you want to remove volvo from select option use this

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