Сбросить значение окна выбора
Я пытаюсь сбросить значение двух полей выбора, структурированных таким образом,
<select>
<option></option>
<option></option>
<option></option>
</select>
<select>
<option></option>
<option></option>
<option></option>
</select>
JQuery,
$('select').each(function(idx, sel) {
$(sel).find('option :eq(0)').attr('selected', true);
});
К сожалению, независимо от того, сколько способов я пробовал, этого просто не происходит. Ничего в консоли. Я понятия не имею, что происходит? Я знаю, что должен быть способ сделать это, вы можете сделать что-нибудь с JS
РЕДАКТИРОВАТЬ:
Я понял, что проблема возникает, когда я пытаюсь запустить код при щелчке элемента dom, однако я знаю, что код должен работать, потому что, когда у меня есть
$('p').click(function(){
console.log('test');
});
Он выводит "тест" на консоль, но когда я включаю код в эту функцию, ничего не происходит. Почему это?
Ответы
Ответ 1
Я предполагаю, что вы хотите сбросить только один элемент. Сброс всей формы прост: вызовите его метод сброса.
Самый простой способ "сбросить" элемент выбора - установить для свойства selectedIndex
значение по умолчанию. Если вы знаете, что ни один из параметров не выбран по умолчанию, просто установите для выделенного элемента selectedIndex значение соответствующее значение:
function resetSelectElement(selectElement) {
selecElement.selectedIndex = 0; // first option is selected, or
// -1 for no option selected
}
Тем не менее, поскольку один из вариантов может иметь выбранный атрибут или иначе быть выбранным по умолчанию, вам может потребоваться:
function resetSelectElement(selectElement) {
var options = selectElement.options;
// Look for a default selected option
for (var i=0, iLen=options.length; i<iLen; i++) {
if (options[i].defaultSelected) {
selectElement.selectedIndex = i;
return;
}
}
// If no option is the default, select first or none as appropriate
selectElement.selectedIndex = 0; // or -1 for no option selected
}
И остерегайтесь устанавливать атрибуты, а не свойства, они имеют разные эффекты в разных браузерах.
Ответ 2
Это работает для меня:
$('select').prop('selectedIndex', 0);
FIDDLE
Ответ 3
В дополнение к ответу на java-скрипт @RobG pure/vanilla вы можете сбросить значение "по умолчанию" с помощью
selectElement.selectedIndex = null;
Кажется, -1 отменяет выбор всех элементов, null выбирает элемент по умолчанию, а 0 или положительное число выбирает соответствующий параметр индекса.
Параметры в выбранном объекте индексируются в том порядке, в котором они определены, начиная с индекса 0.
источник
Ответ 4
Что для меня работало:
$('select option').each(function(){$(this).removeAttr('selected');});
Ответ 5
neRok коснулся этого ответа выше, и я просто расширяю его.
Согласно слегка устаревшему, но удобному справочнику O'Reilly, Javascript: The Definitive Guide:
Свойство selectedIndex объекта Select является целым числом, которое указывает индекс выбранной опции в объекте Select. Если параметр не выбран, selectIndex - -1.
Таким образом, следующий код javascript "сбросит" объект "Выбрать" без каких-либо параметров:
select_box = document.getElementById("myselectbox");
select_box.selectedIndex = -1;
Обратите внимание, что изменение выбора таким образом не вызывает обработчик события onchange().
Ответ 6
использовать .val('')
setter
Пример jsfiddle
$('select').val('1');
Ответ 7
Я нашел небольшую полезную функцию некоторое время назад, и я использовал ее для сброса элементов моей формы с тех пор (источник: http://www.learningjquery.com/2007/08/clearing-form-data):
function clearForm(form) {
// iterate over all of the inputs for the given form element
$(':input', form).each(function() {
var type = this.type;
var tag = this.tagName.toLowerCase(); // normalize case
// it ok to reset the value attr of text inputs,
// password inputs, and textareas
if (type == 'text' || type == 'password' || tag == 'textarea')
this.value = "";
// checkboxes and radios need to have their checked state cleared
// but should *not* have their 'value' changed
else if (type == 'checkbox' || type == 'radio')
this.checked = false;
// select elements need to have their 'selectedIndex' property set to -1
// (this works for both single and multiple select elements)
else if (tag == 'select')
this.selectedIndex = -1;
});
};
... или как плагин jQuery...
$.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')
this.selectedIndex = -1;
});
};