ti-enxame.com

como obter o índice selecionado de uma lista suspensa

Eu tenho um menu suspenso normal que eu quero obter o índice atualmente selecionado e colocá-lo em uma variável. Jquery ou javascript. Jquery preferiu.

<select name="CCards">
<option value="0">Select Saved Payment Method:</option>
<option value="1846">test  xxxx1234</option>
<option value="1962">test2  xxxx3456</option>
</select> 
38
user357034

$("select[name='CCards'] option:selected") deve fazer o truque

Consulte a documentação do jQuery para obter mais detalhes: http://api.jquery.com/selected-selector/

UPDATE: se você precisar do índice da opção selecionada, precisará usar o método jquery .index() jquery:

$("select[name='CCards'] option:selected").index()
63
naivists

Isso fará com que o índice da opção selecionada seja alterado:

$('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>
25
Jamiec

Se você estiver realmente procurando o número do índice (e não o valor) da opção selecionada, será

document.forms[0].elements["CCards"].selectedIndex 
/* You may need to change document.forms[0] to reference the correct form */

ou usando jQuery

$('select[name="CCards"]')[0].selectedIndex 
23
RoToRa

o índice real está disponível como uma propriedade do elemento select.

var sel = document.getElementById('CCards');
alert(sel.selectedIndex);

você pode usar o índice para acessar a opção de seleção, onde pode extrair o texto e o valor.

var opt = sel.options[sel.selectedIndex];
alert(opt.text);
alert(opt.value);
10
lincolnk
<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>
5
Alex

Você também pode usar :checked para _<select>_ elementos

por exemplo.,

_document.querySelector('select option:checked')
document.querySelector('select option:checked').getAttribute('value')
_

Você nem precisa obter o índice e, em seguida, referenciar o elemento pelo seu índice irmão.

2
Daniel Lizik