Cara terbaik untuk membatalkan pilihan <select> di jQuery?

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

Apa cara terbaik, menggunakan jQuery, untuk secara elegan membatalkan pilihan?

Gunakan removeAttr ...

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

Atau Prop

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

Ada banyak jawaban di sini, tetapi sayangnya semuanya sudah cukup tua dan oleh karena itu bergantung pada attr/ removeAttryang sebenarnya bukan cara untuk pergi.

@coffeeyesplease dengan benar menyebutkan bahwa solusi lintas-browser yang baik harus digunakan

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

Solusi lintas-browser yang bagus adalah

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

Anda dapat melihatnya menjalankan swa-uji di sini . Diuji pada IE 7/8/9, FF 11, Chrome 19.

Sudah lama sejak ditanya, dan saya belum menguji ini di browser yang lebih tua tetapi menurut saya jawaban yang jauh lebih sederhana adalah

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

.val () berfungsi untuk pilih juga http://api.jquery.com/val/

Metode paling sederhana

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

Saya hanya menggunakan ini pada pilih sendiri dan itu berhasil.

Saya ada di jQuery 1.7.1 .

Jawaban sejauh ini hanya berfungsi untuk beberapa pilihan di IE6 / 7; untuk non-multi pilih yang lebih umum, Anda perlu menggunakan:

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

Ini dijelaskan dalam pos yang ditautkan oleh flyfishr64. Jika Anda melihatnya, Anda akan melihat bagaimana ada 2 kasus - multi / non-multi. Tidak ada yang menghentikan Anda untuk mendapatkan solusi lengkap:

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

Oh jquery.

Karena belum ada pendekatan javascript asli, saya merasa perlu menyediakannya.

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

Dan hanya untuk menunjukkan seberapa cepat ini: benchmark

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

Ini akan beralih melalui setiap item dan batalkan pilihan hanya yang diperiksa

Google cepat menemukan posting ini yang menjelaskan cara melakukan apa yang Anda inginkan untuk daftar pilih tunggal dan banyak di IE. Solusinya juga tampak cukup elegan:

$('#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

Terima kasih banyak atas solusinya.

Solusi untuk daftar kombo pilihan tunggal bekerja dengan sempurna. Saya menemukan ini setelah mencari di banyak situs.

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

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

Cara sederhana lain:

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

Biasanya ketika saya menggunakan menu pilih, setiap opsi memiliki nilai yang terkait dengannya. Sebagai contoh

<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

Sekarang ini tidak menghapus atribut yang dipilih dari opsi tetapi yang saya inginkan hanyalah nilainya.

Tetapkan id di pilih Anda, seperti:
<select id="foo" size="2">

Maka Anda dapat menggunakan:
$("#foo").prop("selectedIndex", 0).change();