使用JavaScript检查多重选择框中是否已存在选项

Question

My question is same as this - How can I check whether a option already exist in select by JQuery

Although I want to know how it can be done using JavaScript rather than using jQuery. I've tried using the indexOf() , === among other things, but I'm not sure if my approach is correct.

PS : If you're marking it as a duplicate, do link me with the question that has the answer in JavaScript. Thank you.

Also, reasons for down voting are welcome.

My approach :

var foldersList = document.getElementById("folders");
    for(var i=0; i<foldersList.length; i++)
    {
       if(!(foldersList.options[i].value.indexOf("someValue") === -1))
       {
             //do something
       }
    }

Answer 1

You could use document.querySelectorAll :

document.querySelectorAll('#yourSelect option[value="yourValue"]').length > 0

Thats the same as:

$("#yourSelect option[value='yourValue']").length > 0;

Answer 2

The simple way, supported even by the most antique browsers:

function selectHasOption(select, value)
{
    for (var i = 0, len = select.options.length; i != len; ++i) {
        if (select.options[i].value == value) {
            return true;
        }
    }
    return false;
}

And this is the expression:

selectHasOption(document.getElementById('folders'), 'someValue')

Answer 3

var yourSelect = document.getElementById("yourSelect");
for (i = 0; i < yourSelect.length; ++i) {
   if (yourSelect.options[i].value == "someValue") {
      alert("someValue is available");
   }
}