Найкращий спосіб зняти вибір <select> в jQuery?

<select size="2">
<option selected="selected">Input your option</option>
<option>Input your option</option>
</select>

Який найкращий спосіб елегантно скасувати вибір за допомогою jQuery?

Використовуйте removeAttr ...

$("option:selected").removeAttr("selected");

Або проп

$("option:selected").prop("selected", false)

Тут є багато відповідей, але, на жаль, всі вони досить старі, і тому покладаються на attr/ removeAttrщо насправді не є таким шляхом.

@coffeeyesplease правильно зазначає, що добре використовувати крос-браузерне рішення

$("select").val([]);

Ще одне хороше крос-браузерне рішення

// Note the use of .prop instead of .attr
$("select option").prop("selected", false);

Ви можете побачити його запустити самодіагностику тут . Тестовано на IE 7/8/9, FF 11, Chrome 19.

Минув час, коли я запитав, і я не перевіряв це на старих браузерах, але мені здається, набагато простішою відповіддю є

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

.val () працює і для вибору http://api.jquery.com/val/

Найпростіший метод

$('select').val('')

Я просто використав це на селекції, і це зробило трюк.

Я на jQuery 1.7.1 .

Поки відповіді працюють лише для декількох виборів у IE6 / 7; для більш розповсюдженого не-мультиселективного вибору потрібно використовувати:

$("#selectID").attr('selectedIndex', '-1');

Це пояснюється у посту, пов’язаному з flyfishr64. Якщо ви подивитесь на це, то побачите, як існує 2 випадки - мульти / не-мульти. Ніщо не заважає вам сканувати обидва на повне рішення:

$("#selectID").attr('selectedIndex', '-1').find("option:selected").removeAttr("selected");

О джикері.

Оскільки існує ще власний підхід до JavaScript, я відчуваю необхідність його надати.

var select = document.querySelector('select'); //hopefully you'll use a better selector query
select.selectedIndex = 0; // or -1, 0 sets it to first option, -1 selects no options

І просто щоб показати вам, наскільки це швидше: орієнтир

$("#selectID option:selected").each(function(){
  $(this).removeAttr("selected");
});

Це повторить кожен елемент і зніме лише вибір тих, що перевіряються

Швидкий google знайшов цю публікацію, в якій описано, як робити те, що ви хочете, як для одиночних, так і для декількох списків вибору в IE. Рішення також здається досить елегантним:

$('#clickme').click(function() {
        $('#selectmenu option').attr('selected', false);

}); 

$("#select_id option:selected").prop("selected", false);

$(option).removeAttr('selected') //replace 'option' with selected option's selector

Дякую за рішення.

Рішення для комбінованого списку з одним вибором працює чудово. Я знайшов це після пошуку на багатьох сайтах.

$("#selectID").attr('selectedIndex', '-1').children("option:selected").removeAttr("selected");

$("option:selected").attr("selected", false);

Ще один простий спосіб:

$("#selectedID")[0].selectedIndex = -1

Зазвичай, коли я використовую меню вибору, у кожного параметра є пов'язане з ним значення. Наприклад

<select id="nfl">
  <option value="Bears Still...">Chicago Bears</option>
  <option selected="selected" value="Go Pack">Green Bay Packers</option>
</select>
console.log($('#nfl').val()) logs "Go Pack" to the console
Set the value to an empty string $('#nfl').val("")
console.log($('#nfl').val()) logs "" to the console

Тепер це не видаляє вибраний атрибут з опції, але все, що я дуже хочу, це значення.

Встановіть ідентифікатор у виборі, наприклад:
<select id="foo" size="2">

Тоді ви можете використовувати:
$("#foo").prop("selectedIndex", 0).change();