Reset выберите значение по умолчанию
У меня есть поле выбора
<select id="my_select">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
<div id="reset">
reset
</div>
У меня также есть кнопка reset, здесь значение по умолчанию (выбранное) равно "b", предположим, что я выбираю "c", и после того, как мне нужно изменить значение окна выбора для значения по умолчанию, как сделать это с помощью jquery?
$("#reset").on("click", function () {
// What do here?
});
jsfiddle: http://jsfiddle.net/T8sCf/1/
Ответы
Ответ 1
Вы можете использовать свойство defaultSelected
элемента option:
Содержит начальное значение атрибута selected
HTML, указывающее, выбран ли параметр по умолчанию или нет.
Итак, интерфейс DOM уже отслеживает, какая опция была выбрана изначально.
$("#reset").on("click", function () {
$('#my_select option').prop('selected', function() {
return this.defaultSelected;
});
});
DEMO
Это будет работать даже для элементов с несколькими элементами.
Если вы не хотите перебирать все параметры, но "ломаете" после того, как вы нашли первоначально выбранный, вы можете вместо этого использовать .each
:
$('#my_select option').each(function () {
if (this.defaultSelected) {
this.selected = true;
return false;
}
});
Без jQuery:
var options = document.querySelectorAll('#my_select option');
for (var i = 0, l = options.length; i < l; i++) {
options[i].selected = options[i].defaultSelected;
}
Ответ 2
$('#my_select').get(0).selectedIndex = 1;
Но, на мой взгляд, лучший способ - использовать только HTML (с <input type="reset" />
):
<form>
<select id="my_select">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
<input type="reset" value="reset" />
</form>
Ответ 3
$("#reset").on("click", function () {
$("#my_select").val('b');//Setting the value as 'b'
});
Ответ 4
Вы можете использовать атрибут data
элемента select
<select id="my_select" data-default-value="b">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
Ваш JavaScript,
$("#reset").on("click", function () {
$("#my_select").val($("#my_select").data("default-value"));
});
http://jsfiddle.net/T8sCf/10/
UPDATE
Если вы не знаете, выбор по умолчанию, и если вы не можете обновить HTML,
добавить следующий код в DOM готов,
$("#my_select").data("default-value",$("#my_select").val());
http://jsfiddle.net/T8sCf/24/
Ответ 5
Почему бы не использовать простую функцию javascript и называть его onclick-событием?
function reset(){
document.getElementById("my_select").selectedIndex = 1; //1 = option 2
}
Ответ 6
$("#reset").on("click", function () {
$('#my_select').prop('selectedIndex',0);
});
Ответ 7
Один хороший чистый способ - добавить атрибут data-default
к выбору
<select id="my_select" data-default="b">
...
</select>
Затем код действительно прост:
$("#reset").on("click", function () {
var $select = $('#my_select');
$select.val($select.data('default'));
});
Пример в реальном времени: http://jsfiddle.net/T8sCf/7/
Ответ 8
Вы также можете reset значения нескольких SELECT и затем запустить кнопку отправки.
См. здесь в действии:
Пример Live:
$(function(){
$("#filter").click(function(){
//alert('clicked!');
$('#name').prop('selectedIndex',0);
$('#name2').prop('selectedIndex',0);
$('#submitBtn').click();
});
});
Ответ 9
<select id="my_select">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
<div id="reset">
reset
</div>
$("#reset").on("click", function () {
$('#my_select').prop('selectedIndex',0);
});
Это простой способ для вашего вопроса. только одна строка ответа.
Ответ 10
Привяжите обработчик события к событию фокусировки select
, чтобы зафиксировать предыдущее значение. Затем установите значение select
на предыдущее значение при нажатии reset.
var previousValue = "";
$("#my_select").on("focus",function(){
previousValue = $(this).val();
});
$("#reset").on("click", function () {
$("#my_select").val(previousValue);
});
Рабочий пример: http://jsfiddle.net/T8sCf/17/
Ответ 11
Вы можете сделать так:
var preval = $('#my_select').val(); // get the def value
$("#reset").on("click", function () {
$('#my_select option[value*="' + preval + '"]').prop('selected', true);
});
проверить эту скрипту
возьмите var
, который содержит загруженное по умолчанию значение перед событием изменения, затем получите опцию с помощью селектора атрибутов значения, удерживая значение var
, чтобы установить свойство в значение.
Ответ 12
Этот код поможет вам.
<html>
<head>
<script type="text/JavaScript" src="jquery-2.0.2.min.js"></script>
<script type="text/JavaScript">
$(function(){
var defaultValue = $("#my_select").val();
$("#reset").click(function () {
$("#my_select").val(defaultValue);
});
});
</script>
</head>
<body>
<select id="my_select">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
<div id="reset">
<input type="button" value="reset"/>
</div>
</body>
Ответ 13
При использовании форм Spring вам может понадобиться reset выбранная вами метка параметров. Вы должны установить свою форму: выбрать значение id для пустой строки, сбрасывает ваш выбор на метку по умолчанию.
<form:select path="myBeanAttribute" id="my_select">
<form:option value="" label="--Select One--"/>
<form:options items="${mySelectionValueList}"/>
</form:select>
$("#reset").on("click", function () {
$("#my_select").val("");
});
в случае, когда есть кнопка reset. В противном случае
$("#my_select").val("");
Ответ 14
Для тех, кто работает с Bootstrap-select, вы можете использовать это:
$('#mySelect').selectpicker('render');
Ответ 15
Простым способом выполнения является
var myselect = $("select.SimpleAddAClass");
myselect[0].selectedIndex = 0;
myselect.selectmenu("refresh");
Ответ 16
С jquery:
$("#reset").on("click", function() {
$('#my_select').val($('#my_select').find('option[selected="selected"]').val());
}
Ответ 17
$("#reset").on("click", function () {
$('#my_select').val('-1');
});
http://jsfiddle.net/T8sCf/1323/
Ответ 18
Это работает для меня:
$("#reset").on("click", function () {
$("#my_select option[selected]").prop('selected', true);
}
Вы найдете для опции по умолчанию, которая имеет атрибут select, и вы меняете выбор на этот параметр.
Ответ 19
Reset все поля выбора для параметра по умолчанию, где выбран выбранный атрибут.
$("#reset").on("click", function () {
// Reset all selections fields to default option.
$('select').each( function() {
$(this).val( $(this).find("option[selected]").val() );
});
});
Ответ 20
Я пытался решить это, как и другие ответы, к сожалению, я не получил правильного пути для этого, как только попытался, как я пишу ниже:
$('#<%=ddID.ClientID %>').get(0).selectedIndex = 0;
этот код работает для меня, я надеюсь, что это будет полезно для вас, ребята.
С наилучшими пожеланиями.
Самуэль Альварадо.
Ответ 21
$('#my_select').find('option:not(:first)').remove();
Вызывайте эту функцию каждый раз перед заполнением выбора
Ответ 22
У меня есть поле выбора
<select id="my_select">
<option value="a">a</option>
<option value="b" selected="selected">b</option>
<option value="c">c</option>
</select>
<div id="reset">
reset
</div>
У меня также есть кнопка reset, здесь значение по умолчанию (выбранное) равно "b", предположим, что я выбираю "c", и после того, как мне нужно изменить значение окна выбора для значения по умолчанию, как сделать это с помощью Angular2?