Как изменить значение <select>из JavaScript - PullRequest
Новая
       33

Как изменить значение <select>из JavaScript

36 голосов
/ 29 февраля 2012

У меня есть вопрос, который кажется очень простым, но я просто не могу понять его правильно.У меня есть <select> со списком параметров и значением по умолчанию.После того, как пользователь выберет опцию и нажмет на кнопку, я хочу, чтобы выбор вернулся к значению по умолчанию.

<select id="select">
 <option value="defaultValue">Default</option>
 <option value="Option1">Option1</option>
 <option value="Option2">Option2</option>    
</select>
<input type="button" value="CHANGE" onclick="selectFunction()" />

Итак, предположим, что пользователь выбирает вариант 1. Я получаю это значение с помощью javascript, но после этого я хочу, чтобы выборка снова показала «По умолчанию».

Я обнаружил, что при document.getElementById("select").value = "defaultValue" не сработает.

Кто-нибудь знает, как вернуть это значение по умолчанию?

Ответы [ 9 ]

53 голосов
/ 29 февраля 2012

Установка .value на значение одного из параметров работает во всех неопределенно текущих браузерах.В очень старых браузерах вы должны были установить selectedIndex: 

document.getElementById("select").selectedIndex = 0;

Если ни тот, ни ваш исходный код не работают, мне интересно, если вы используете IE и у вас есть что-то еще на странице создания чего-то, что называется "выбрать"?(Или как name, или как глобальная переменная?) Поскольку в некоторых версиях IE есть проблема , когда они объединяют пространства имен.Попробуйте изменить id для выбора на "fluglehorn", и если это сработает, вы знаете, что это проблема.

9 голосов
/ 29 февраля 2012

Я обнаружил, что выполнение document.getElementById("select").value = "defaultValue" не сработает.

Вы, должно быть, столкнулись с отдельной ошибкой, так как она отлично работает в этой живой демонстрации .

А вот полный рабочий код на случай, если вы заинтересованы: 

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Demo</title>
    <script type="text/javascript">
        var selectFunction = function() {
            document.getElementById("select").value = "defaultValue";
        };
    </script>
</head>
<body>
    <select id="select">
        <option value="defaultValue">Default</option>
        <option value="Option1">Option1</option>
        <option value="Option2">Option2</option>    
    </select>
    <input type="button" value="CHANGE" onclick="selectFunction()" />
</body>
</html>
8 голосов
/ 29 февраля 2012

document.getElementById("select").selectedIndex = 0 будет работать

4 голосов
/ 22 июля 2015 
$('#select').val('defaultValue'); 
$('#select').change();

Это также вызовет события, подключенные к этому выбору

4 голосов
/ 29 февраля 2012

После того, как вы выполнили обработку в selectFunction (), вы можете сделать следующее 

document.getElementById('select').selectedIndex = 0;
document.getElementById('select').value = 'Default';
3 голосов
/ 29 февраля 2012

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

   document.getElementById("select").selectedIndex = 0;
2 голосов
/ 27 сентября 2013

Мне кажется, я знаю, в чем здесь проблема - если вы пытаетесь выбрать вариант, который не существует, он не будет работать. Вы должны добавить опцию в первую очередь. Вот так: 

var option=document.createElement("option");
option.text=document.getElementById('other_referee').value
document.getElementById('referee_new').add(option,null);
document.getElementById('referee_new').value = document.getElementById('other_referee').value;

Не элегантно, но вы поняли.

2 голосов
/ 29 февраля 2012 
 <script language="javascript" type="text/javascript">
        function selectFunction() {
             var printStr = document.getElementById("select").options[0].value
            alert(printStr);
            document.getElementById("select").selectedIndex = 0;
        }
    </script>
1 голос
/ 29 февраля 2012

Вы можете использовать свойство selectedIndex, чтобы установить для него первый параметр: 

document.getElementById("select").selectedIndex = 0;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...