Найти выбранную по умолчанию опцию в теге выбора HTML? - PullRequest
6 голосов
/ 03 октября 2010

Я нашел код в Интернете, чтобы очистить форму, но в поле выбора ничего не было.С jquery я попытался добавить код, чтобы выбрать вариант по умолчанию в поле выбора, когда я сбросил форму.Я понял, что единственный способ найти значение по умолчанию - это найти параметр SELECTED.Затем я обнаружил, что когда пользователь выбирает что-то еще, jquery не видит выбранный по умолчанию, но что касается новой опции, выбранной пользователем.

Как мне найти параметр по умолчанию в форме, чтобы я мог очистить его правильно?

//http://www.learningjquery.com/2007/08/clearing-form-data
$.fn.clearForm = function () {
    return this.each(function () {
        var type = this.type, tag = this.tagName.toLowerCase();
        if (tag == 'form')
            return $(':input', this).clearForm();
        if (type == 'text' || type == 'password' || tag == 'textarea')
            this.value = '';
        else if (type == 'checkbox' || type == 'radio')
            this.checked = false;
        else if (tag == 'select') {
            //alert($('option', this).size());
            alert($('option[selected]', this).val());
        }
    });
};

Ответы [ 4 ]

12 голосов
/ 11 марта 2011

Я использовал следующий фрагмент для достижения этой цели:

$(this).val($(this).find('option[selected]').val());

option[selected] получит «жестко закодированные» выбранные опции (по умолчанию).option:selected напротив, получит текущие выбранные опции.

Это будет работать для одиночных выборов, для нескольких выборов требуется другой подход:

$(this).find('option').each(function(i, opt) {
    opt.selected = opt.defaultSelected;
});

Это работает для одиночных выбороввыбирает тоже.

3 голосов
/ 03 октября 2010

Обычно по умолчанию это первый <option> в <select>, так что вы можете сделать это:

$(this).find("option:first").attr("selected", true);

Хотя, если вы сбрасываете всю форму, вы можете сбросить ее до того, что было при загрузке страницы с помощью вызова .reset(), например:

if (tag == 'form')
  this.reset();

Я не уверен, что это то, что вы действительно после, но просто выбросить это там. Часто нативные методы DOM уже очень удобны, не игнорируйте их!

2 голосов
/ 26 сентября 2012

Ответ Корактора на меня не сработал и в Chrome, и я не мог использовать form.reset (), потому что хотел сбросить подмножество формы. Я обнаружил, что самое простое, что нужно сделать, - это выбрать selectValue по умолчанию при загрузке страницы, тогда функция сброса работает с использованием одной и той же строки для всех элементов, возвращаемых селектором: input.

    $("#top1 select").each(function() {
        this.defaultValue = $(this).val();
    });

    $(".reset").click(function() {
        $('#top1 :input').each(function() {
            $(this).val(this.defaultValue);
        });
    });
2 голосов
/ 28 февраля 2012

Я обнаружил, что ответ Корактора не работает в IE8 и ниже.Я решил эту проблему, перебирая опции, пока не нашел выбранный по умолчанию:

var defaultValue;
$(this).find('option').each(function (i, o) {
  if (o.defaultSelected) {
    defaultValue = o.value;
    return;
  }
});

Менее элегантно, но работает в IE.

...