Ответ 1
Он ищет элемент с id list
, который имеет свойство value
, равное 2. То, что вы хотите, это дочерний option
list
.
$("#list option[value='2']").text()
Хорошо, скажу, что у меня есть это:
<select id='list'>
<option value='1'>Option A</option>
<option value='2'>Option B</option>
<option value='3'>Option C</option>
</select>
Как бы выглядел селектор, если бы я хотел получить "Option B", когда у меня есть значение "2"?
Обратите внимание, что это не спрашивает, как получить выбранное текстовое значение, но только любое из них, независимо от того, выбрано или нет, в зависимости от атрибута value. Я пробовал:
$("#list[value='2']").text();
Но он не работает.
Он ищет элемент с id list
, который имеет свойство value
, равное 2. То, что вы хотите, это дочерний option
list
.
$("#list option[value='2']").text()
Если вы хотите получить опцию со значением 2, используйте
$("#list option[value='2']").text();
Если вы хотите получить тот вариант, который выбран в данный момент, используйте
$("#list option:selected").text();
Это отлично сработало для меня, я искал способ отправить два разных значения с параметрами, сгенерированными MySQL, и следующее является общим и динамическим:
$(this).find("option:selected").text();
Как упоминалось в одном из комментариев. С этим я смог создать динамическую функцию, которая работает со всеми моими блоками выбора, которые я хочу получить как значениями, так и значением параметра и текстом.
Несколько дней назад я заметил, что при обновлении jQuery с 1,6 до 1,9 сайта я использовал этот код, эта работа перестала работать... возможно, это был конфликт с другим фрагментом кода... в любом случае решение заключалось в удалении вариант из вызова find():
$(this).find(":selected").text();
Это было мое решение... используйте его, только если у вас возникли проблемы после обновления jQuery.
Основываясь на исходном HTML, опубликованном Паоло, я придумал следующее.
$("#list").change(function() {
alert($(this).find("option:selected").text()+' clicked!');
});
Он был протестирован для работы в Internet Explorer и Firefox.
$("#list option:selected").each(function() {
alert($(this).text());
});
для нескольких выбранных значений в элементе #list
.
Если на странице есть только один тег select, вы можете указать выбор внутри id 'list'
jQuery("select option[value=2]").text();
Чтобы получить выделенный текст
jQuery("select option:selected").text();
Попробуйте следующее:
$("#list option[value=2]").text();
Причина, по которой ваш исходный фрагмент не работал, заключается в том, что теги OPTION
являются дочерними элементами вашего тега SELECT
, который имеет id
list
.
Это старый вопрос, который не был обновлен через некоторое время, правильный способ сделать это теперь будет использовать
$("#action").on('change',function() {
alert($(this).find("option:selected").text()+' clicked!');
});
Надеюсь, это поможет: -)
$(this).children(":selected").text()
Я хотел получить выбранный ярлык. Это работало для меня в jQuery 1.5.1.
$("#list :selected").text();
$("#list [value='2']").text();
оставить пробел после селектора id.
Вы можете получить выбранный текст с помощью функции .text();
вы можете вызвать функцию следующим образом:
jQuery("select option:selected").text();
Во время "циклизации" через динамически создаваемые элементы select с .each(function()...): $("option:selected").text();
и $(this + " option:selected").text()
не вернули выбранный текст опции - вместо этого он был равен нулю.
Но решение Питера Мортенсена работало:
$(this).find("option:selected").text();
Я не знаю, почему обычный способ не удается в .each()
(возможно, моя собственная ошибка), но спасибо, Питер. Я знаю, что это был не оригинальный вопрос, а упоминание об этом "для новичков, которые появляются через Google".
Я бы начал с $('#list option:selected").each()
, за исключением того, что мне нужно было захватить вещи из элемента select.
Использование:
function selected_state(){
jQuery("#list option").each(function(){
if(jQuery(this).val() == "2"){
jQuery(this).attr("selected","selected");
return false;
}
});
}
jQuery(document).ready(function(){
selected_state();
});
Я искал получение val по имени внутреннего поля вместо ID и пришел из google в этот пост, который помог, но не нашел нужное мне решение, но я получил решение, и вот оно:
Таким образом, это может помочь кому-то искать выбранное значение с внутренним именем поля вместо использования длинного идентификатора для списков SharePoint:
var e = $('select[title="IntenalFieldName"] option:selected').text();
Мне нужен был этот ответ, поскольку я имел дело с динамически отличным объектом, а другие методы здесь не работали:
element.options[element.selectedIndex].text
Это, конечно, использует объект DOM вместо разбора его HTML с помощью nodeValue, childNodes и т.д.
Совет: вы можете использовать код ниже, если ваше значение динамическое:
$("#list option[value='"+aDynamicValue+"']").text();
Или (лучший стиль)
$("#list option").filter(function() {
return this.value === aDynamicValue;
}).text();
Как упоминалось в jQuery получить конкретный текст тега опции и поставить динамическую переменную в значение
В качестве альтернативного решения вы также можете использовать контекстную часть селектора jQuery, чтобы найти <option>
элемент с value="2"
внутри выпадающего списка:
$("option[value='2']", "#list").text();
Мне нужна динамическая версия для множественного выбора, которая отображает то, что выбрано справа (желательно, чтобы я читал и видел $(this).find
... ранее):
<script type="text/javascript">
$(document).ready(function(){
$("select[showChoices]").each(function(){
$(this).after("<span id='spn"+$(this).attr('id')+"' style='border:1px solid black;width:100px;float:left;white-space:nowrap;'> </span>");
doShowSelected($(this).attr('id'));//shows initial selections
}).change(function(){
doShowSelected($(this).attr('id'));//as user makes new selections
});
});
function doShowSelected(inId){
var aryVals=$("#"+inId).val();
var selText="";
for(var i=0; i<aryVals.length; i++){
var o="#"+inId+" option[value='"+aryVals[i]+"']";
selText+=$(o).text()+"<br>";
}
$("#spn"+inId).html(selText);
}
</script>
<select style="float:left;" multiple="true" id="mySelect" name="mySelect" showChoices="true">
<option selected="selected" value=1>opt 1</option>
<option selected="selected" value=2>opt 2</option>
<option value=3>opt 3</option>
<option value=4>opt 4</option>
</select>
Вы можете получить один из следующих способов
$("#list").find('option').filter('[value=2]').text()
$("#list").find('option[value=2]').text()
$("#list").children('option[value=2]').text()
$("#list option[value='2']").text()
$(function(){
console.log($("#list").find('option').filter('[value=2]').text());
console.log($("#list").find('option[value=2]').text());
console.log($("#list").children('option[value=2]').text());
console.log($("#list option[value='2']").text());
});
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id='list'>
<option value='1'>Option A</option>
<option value='2'>Option B</option>
<option value='3'>Option C</option>
</select>
Если вы хотите получить выбранное значение, то:
$("#list option:selected").text();