вы также можете сбросить значение select2 с помощью

$(function() {
  $('#d').select2('data', null)
})

также вы можете пройти 'allowClear': true при вызове select2 и он будет иметь кнопку X для сброса его значения.

согласно последней версии (select2 3.4.5) документировано здесь, это будет так:

 $("#my_select").select2("val", "");

версия 4.0

$('#d').val('').trigger('change');

это правильное решение отныне в соответствии с устаревшим сообщением, брошенным в режиме отладки: - The select2("val") метод устарел и будет удален в более поздних версиях Select2. Использовать $element.val() вместо"

вы можете использовать:

$("#d").val(null).trigger("change"); 

это очень просто и работает правильно! Если использовать с кнопкой сброса:

$('#btnReset').click(function() {
    $("#d").val(null).trigger("change"); 
});

лучший способ сделать это:

$('#e1.select2-offscreen').empty(); //#e1 : select 2 ID
$('#e1').append(new Option()); // to add the placeholder and the allow clear

Я вижу три проблемы:

1. отображение элемента управления Select2 не обновляется при изменении его значения из-за сброса формы.
2. опция " Все " не имеет .
3. опция" Все " отключена.

во-первых, я рекомендую вам использовать setTimeout функция для обеспечения выполнения кода после завершения сброса формы.

вы можете выполнить код, когда кнопка щелчок:

$('#searchclear').click(function() {
    setTimeout(function() {
        // Code goes here.
    }, 0);
});

или когда форма сбрасывается:

$('form').on('reset', function() {
    setTimeout(function() {
        // Code goes here.
    }, 0);
});

что касается того, какой код использовать:

поскольку параметр " все " отключен, сброс формы не делает его выбранным значением. Поэтому вы должны явно установить, что это выбранное значение. Способ сделать это-с помощью функции Select2 "val". И поскольку "все" не было!--6--> атрибут, его значение совпадает с его текстом, который является "все". Поэтому, вы должны используйте код, заданный thtsigma в выбранном ответе:

$("#d").select2('val', 'All');

если атрибут value="" должны быть добавлены к опции "все", тогда вы можете использовать код, данный Даниэлем денером:

$("#d").select2('val', '');

если опция " Все " не была отключена, то вам просто нужно будет заставить Select2 обновиться, и в этом случае вы можете использовать:

$('#d').change();

Примечание: следующий код Lenart-это способ очистить выбор, но это не приводит к тому, что опция "Все выбрано:

$('#d').select2('data', null)

Если у вас есть заполненный виджет выбора, например:

<select>
    <option value="1">one</option>
    <option value="2" selected="selected">two</option>
    <option value="3">three</option>
    ...

вы хотите убедить select2 восстановить первоначально выбранное значение при сбросе, аналогично тому, как работает собственная форма. Для этого сначала сбросьте родную форму, а затем обновите select2:

$('button[type="reset"]').click(function(event) {
    // Make sure we reset the native form first
    event.preventDefault();
    $(this).closest('form').get(0).reset();
    // And then update select2 to match
    $('#d').select2('val', $('#d').find(':selected').val());
}

то, что я нашел, хорошо работает следующим образом:

Если у вас есть опция заполнителя, такая как " все " или " - Select -", и его первый вариант, и это то, что вы хотите установить значение, когда вы "сбрасываете", вы можете использовать

$('#id').select2('val',0);

0-это, по сути, опция, которую вы хотите установить на сброс. Если вы хотите установить его в последний вариант, то получите длину опций и установите ее в длину - 1. В основном используйте индекс любой опции, которую вы хотите установить значение select2 в on сброс.

Если у вас нет заполнителя и вы просто не хотите, чтобы текст отображался в поле, используйте:

$('#id').select2('val','');

для достижения общего решения, почему бы не сделать это:

$(':reset').live('click', function(){
    var $r = $(this);
    setTimeout(function(){ 
        $r.closest('form').find('.select2-offscreen').trigger('change'); 
    }, 10);
});

таким образом: Вам не придется создавать новую логику для каждого select2 в вашем приложении.

и вам не обязательно знать значение по умолчанию (которое, кстати, не обязательно должно быть "" или даже первый вариант)

и, наконец, значение :selected не всегда достигнет истинного сброса, так как текущий избранные вполне могло быть установлено программно на клиент, тогда как действие по умолчанию form select - это возврат значений входных элементов на отправленные сервером.

EDIT: В качестве альтернативы, учитывая устаревший статус live, мы могли бы заменить первую строку на это:

$('form:has(:reset)').on('click', ':reset', function(){

или еще лучше:

$('form:has(:reset)').on('reset', function(){

PS: я лично чувствую, что сброс на сброс, а также запуск blur и focus события, прикрепленные к исходному select, являются некоторыми из самые заметные "отсутствующие" функции в select2!

Select2 использует определенный класс CSS, поэтому простой способ сбросить его:

$('.select2-container').select2('val', '');

и у вас есть преимущество, если у вас есть несколько Select2 в одной форме, все они будут сброшены с помощью этой одной команды.

иногда я хочу сбросить Select2, но я не могу без метода change (). Поэтому мое решение:

function resetSelect2Wrapper(el, value){
    $(el).val(value);
    $(el).select2({
        minimumResultsForSearch: -1,
        language: "fr"
    });
}

использование :

resetSelect2Wrapper("#mySelectId", "myValue");

для меня он работает только с любым из этих решений

$(this).select2('val', null);

или

$(this).select2('val', '');

    // Store default values
    $('#filter_form [data-plugin="select2"]').each(function(i, el){
        $(el).data("seldefault", $(el).find(":selected").val());
        });

    // Reset button action
    $('#formresetbtn').on('click', function() {
        $('#filter_form [data-plugin="select2"]').each(function(i, el){
            $(el).val($(el).data("seldefault")).trigger('change');
            });
        });