How to clear all selected items in a SELECT input using jQuery?

Question

I am think this should be fairly easy, but struggling a bit ... I have a SELECT input element that allows the user to select multiple items. I would like to provide a mechanism for them to clear all selected items, probably will just be a SPAN tag or something similar.

Anyway ... using jQuery, how I would I clear the selection on the SELECT input element so no items are selected.

Answer 1

In the case of a <select multiple> the .val() function takes/returns an array, so you can simply pass in an empty array to clear the selection, like this:

$("#selectID").val([]);

You can test it out here .

Answer 2

This worked to clear all selected options for me..

$("#selectListName").prop('selectedIndex', -1)

The select list looked like

<select multiple='multiple' id='selectListName'> 
  <option>1</option> 
  <option>2</option> 
  <option>3</option> 
  <option>4</option>
</select>

Answer 3

Try: // Just put # before select to fix this. Works perfect. $("#select option:selected").each(function () { $(this).remove(); //or whatever else });

Answer 4

只有这对我有用：-

$("#selectid").find('option').attr("selected",false) ;

Answer 5

This solution worked for me...

$('#my-Select').val('').trigger('change');

This works on almost any input type.

Answer 6

我尝试类似的东西

$("#my-Select").find('option').attr("selected","") ;

Answer 7

Try this

<select id='select1' ></select>
<input type= 'button' value = 'Clear Selection' id = 'remove' />

$(document).ready(function() {  
   $('#remove').click(function() {  
     return $('#select1 option:selected').remove(); 
   });
 });

Answer 8

Maybe 

$('#mySelect option').each(function(i, e)
{
   e.selected = false
});

Answer 9

Try that:

$("#selectID").empty();

Worked for me!

Answer 10

Better than this, you can use:

$("#selectID").empty();

That works on almost anything in the DOM.