Вопрос: Как получить значение и текст выбранного элемента в ?
Ответ: У вас уже есть правильный код, который извлекает значение и текст выбранного элемента в выпадающем списке. Рассмотрим ваш HTML-код:
<select id="ddlViewBy">
<option value="1">test1</option>
<option value="2" selected="selected">test2</option>
<option value="3">test3</option>
</select>
Когда вы выполняете следующий JavaScript-код:
var e = document.getElementById("ddlViewBy");
var value = e.value;
var text = e.options[e.selectedIndex].text;
Результаты будут такими:
value == "2"
text == "test2"
Пример с интерактивным изменением:
Вы также можете установить обработчик события onchange, чтобы отслеживать изменения в выпадающем списке и выводить текущее значение и текст выбранного элемента в консоль:
var e = document.getElementById("ddlViewBy");
function onChange() {
var value = e.value;
var text = e.options[e.selectedIndex].text;
console.log(value, text);
}
e.onchange = onChange;
onChange(); // Вызываем функцию один раз, чтобы вывести начальные значения
Полный код с элементом формы:
<form>
<select id="ddlViewBy">
<option value="1">test1</option>
<option value="2" selected="selected">test2</option>
<option value="3">test3</option>
</select>
</form>
Этот подход позволяет вам легко получать значение и текст выбранного элемента с помощью JavaScript. Не забудьте, что значение (value) будет строкой, даже если оно выглядит как число.
Boo
•
12.12.2024 11:34
Пожаловаться
1
Ваш код правильный и даст вам значение выбранного элемента:
var strUser = e.options[e.selectedIndex].value;
Если вам нужно получить текст выбранного элемента, используйте:
var strUser = e.options[e.selectedIndex].text;
Для ясности в терминологии, вот пример:
<select>
<option value="hello">Hello World</option>
</select>
У этого элемента есть:
Индекс = 0
Значение = hello
Текст = Hello World
Grego85
•
12.12.2024 07:01
Пожаловаться
0
В данном коде выполняется получение значения выбранного элемента из выпадающего списка (select) с идентификатором "ddlViewBy". Чтобы перевести данное выражение на русский, можем сказать:
var выбранноеЗначение = document.getElementById("ddlViewBy").value;
Таким образом, переменная выбранноеЗначение будет содержать текущее выбранное значение из элемента с идентификатором "ddlViewBy".
BucKet9
•
11.12.2024 09:05
Пожаловаться
0
Если вы когда-нибудь наткнетесь на код, написанный исключительно для Internet Explorer, вы можете увидеть следующее:
var e = document.getElementById("ddlViewBy");
var strUser = e.options(e.selectedIndex).value;
Запуск вышеуказанного кода в Firefox и других браузерах приведет к ошибке 'is not a function', потому что Internet Explorer позволяет использовать круглые скобки вместо квадратных:
var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].value;
Правильный способ - использовать квадратные скобки.
LumaSpark47
•
10.12.2024 08:38
Пожаловаться
0
Есть два способа получить выбранное значение: с использованием JavaScript или jQuery.
JavaScript:
var getValue = document.getElementById('ddlViewBy').selectedOptions[0].value;
alert(getValue); // Это выведет выбранное значение.
ИЛИ
var ddlViewBy = document.getElementById('ddlViewBy');
var value = ddlViewBy.options[ddlViewBy.selectedIndex].value;
var text = ddlViewBy.options[ddlViewBy.selectedIndex].text;
alert(value); // Это выведет выбранное значение.
alert(text); // Это выведет текст выбранного значения.
jQuery:
$("#ddlViewBy:selected").text(); // Текст выбранного значения
$("#ddlViewBy").val(); // Выводит значение ID 'ddlViewBy'
NovaEcho23
•
12.12.2024 20:42
Пожаловаться
Чтобы ответить на вопрос, пожалуйста, войдите или
зарегистрируйтесь
Статистика
Задан
08.12.2024
Просмотров
18
Ответов
5
Похожие вопросы
0 ответ(ов)
11 просмотр(ов)
Как удалить все опции из выпадающего списка и добавить одну опцию, затем выбрать её с помощью jQuery?
javascript
jquery
html-select
+1
0 ответ(ов)
10 просмотр(ов)
jQuery: Получение текста конкретного тега option
javascript
jquery
jquery-selectors
+1
0 ответ(ов)
15 просмотр(ов)
Добавление опций в <select> с помощью jQuery?
javascript
jquery
html-select
0 ответ(ов)
24 просмотр(ов)
В чем разница между String.slice и String.substring?
javascript
substring
slice
+1
0 ответ(ов)
13 просмотр(ов)
Проверка соответствия строки регулярному выражению в JS
javascript
regex
match
Популярные метки
javascript
×420
python
×345
java
×178
css
×114
bash
×103
html
×100
string
×94
c++
×81
jquery
×78
arrays
×77
Руководство по Markdown
Форматирование текста
**жирный текст**
*курсив*
~~зачеркнутый~~
# Заголовок 1
## Заголовок 2
Код
```csharp
public class Example {
// ваш код
}
```
`строка кода`
Списки
* Маркированный список
* Второй пункт
* Вложенный пункт
Поддерживаемые языки программирования
Популярные
csharp - C#
javascript - JavaScript
typescript - TypeScript
html - HTML
css - CSS
sql - SQL
json - JSON
xml - XML
Другие .NET
fsharp - F#
vbnet - VB.NET
powershell - PowerShell
razor - Razor
aspnet - ASP.NET
Базы данных
tsql - T-SQL
plsql - PL/SQL
mongodb - MongoDB
redis - Redis
Чтобы добавить блок кода, используйте три обратных кавычки и укажите язык, например: ```csharp
Пожаловаться на ответ
Причина жалобы
Выберите причину...
Спам
Оскорбление
Неприемлемый контент
Нарушение авторских прав
Другое
Описание проблемы