Как получить значения из select в Javascript?

Пользователь

magdalen_kub

от magdalen_kub , в категории: JavaScript , год назад

44 | 0

programming

3 ответа

Пользователь

dmitrypro77

от dmitrypro77 , год назад

@magdalen_kub Используйте селектор option:checked и затем value свойство чтобы получить значения из select в Javascript, ниже пример кода:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Как получить значения из select в Javascript?</title>
    <meta charset="UTF-8" />
</head>
<body>
    <label for="country">Выберите страну</label>
    <select id="country">
        <option value="Russia">Russia</option>
        <option value="USA">USA</option>
        <option value="Germany">Germany</option>
    </select>
    <button id="show">Получить значение</button>
</body>
<script>
    document.querySelector("#show").addEventListener("click", () => {
        let selected = document.querySelector("#country option:checked").value;
        console.log(selected)
    })
</script>
</html>

4 | 0

Всегда открыт для интересных проектов. Ссылки на мои соц. сети в профиле.

Пользователь

yasmine

от yasmine , 5 месяцев назад

@magdalen_kub

Вы можете получить значения из элемента select в JavaScript с помощью свойства value выбранного элемента или с использованием свойства options для доступа к каждому отдельному элементу выбора.

Вот несколько примеров:

Получить значение выбранного элемента select по его value:

1
2
3

var selectElement = document.getElementById("mySelect");
var selectedValue = selectElement.value;
console.log(selectedValue);

Получить текст выбранного элемента select:

1
2
3

var selectElement = document.getElementById("mySelect");
var selectedText = selectElement.options[selectElement.selectedIndex].text;
console.log(selectedText);

Получить значение и текст для каждого элемента select:

var selectElement = document.getElementById("mySelect");
var options = selectElement.options;

for (var i = 0; i < options.length; i++) {
  var option = options[i];
  var optionValue = option.value;
  var optionText = option.text;
  
  console.log(optionValue + ": " + optionText);
}

Слушатель события изменения выбранного элемента select:

var selectElement = document.getElementById("mySelect");

selectElement.addEventListener("change", function() {
  var selectedValue = selectElement.value;
  console.log(selectedValue);
});

Здесь "mySelect" - это идентификатор вашего элемента select, который вы можете изменить на свой собственный.

1 | 0

Пользователь

sylvester

от sylvester , 5 месяцев назад

@magdalen_kub

Для получения значений из элемента <select> в Javascript можно использовать следующий пример кода:

// Получить ссылку на элемент <select>
var selectElement = document.getElementById("mySelect");

// Получить выбранную опцию
var selectedValue = selectElement.value;

// Получить текст выбранной опции
var selectedText = selectElement.options[selectElement.selectedIndex].text;

В данном примере mySelect - это идентификатор элемента <select>, который нужно получить. Мы используем метод getElementById() для получения ссылки на элемент.

Затем мы можем получить значение выбранной опции, используя свойство value элемента <select>.

Чтобы получить текст выбранной опции, мы можем использовать свойство options элемента <select>, чтобы получить доступ к массиву всех опций, и выбрать выбранную опцию с помощью свойства selectedIndex. Затем, используя свойство text выбранной опции, мы можем получить текст этой опции.

0 | 0

Как получить значения из select в Javascript?

3 ответа

Похожие обсуждения: