Как получить выбранный индекс выпадающего списка
У меня есть нормальный раскрывающийся список, который я хочу получить в текущий выбранный индекс и поместить его в переменную. JQuery или javascript. Jquery подал заявку.
<select name="CCards">
<option value="0">Select Saved Payment Method:</option>
<option value="1846">test xxxx1234</option>
<option value="1962">test2 xxxx3456</option>
</select>
Ответы
Ответ 1
$("select[name='CCards'] option:selected")
должен сделать трюк
Подробнее см. документацию по jQuery: http://api.jquery.com/selected-selector/
UPDATE:
если вам нужен индекс выбранного параметра, вам нужно использовать метод .index()
jQuery:
$("select[name='CCards'] option:selected").index()
Ответ 2
Это приведет к изменению индекса выбранной опции:
$('select').change(function(){
console.log($('option:selected',this).index());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="CCards">
<option value="0">Select Saved Payment Method:</option>
<option value="1846">test xxxx1234</option>
<option value="1962">test2 xxxx3456</option>
</select>
Ответ 3
Если вы действительно ищете номер индекса (а не значение) выбранной опции, то это будет
document.forms[0].elements["CCards"].selectedIndex
/* You may need to change document.forms[0] to reference the correct form */
или с помощью jQuery
$('select[name="CCards"]')[0].selectedIndex
Ответ 4
фактический индекс доступен как свойство элемента select.
var sel = document.getElementById('CCards');
alert(sel.selectedIndex);
вы можете использовать индекс, чтобы перейти к опции выбора, где вы можете вытащить текст и значение.
var opt = sel.options[sel.selectedIndex];
alert(opt.text);
alert(opt.value);
Ответ 5
<select name="CCards" id="ccards">
<option value="0">Select Saved Payment Method:</option>
<option value="1846">test xxxx1234</option>
<option value="1962">test2 xxxx3456</option>
</select>
<script type="text/javascript">
/** Jquery **/
var selectedValue = $('#ccards').val();
//** Regular Javascript **/
var selectedValue2 = document.getElementById('ccards').value;
</script>
Ответ 6
Вы также можете использовать :checked
для <select>
элементов
например.
document.querySelector('select option:checked')
document.querySelector('select option:checked').getAttribute('value')
Вам даже не нужно получать индекс, а затем ссылаться на элемент по его индексу sibling.