So erhalten Sie den ausgewählten Index eines Dropdowns

Ich habe ein normales Dropdown-Menü, aus dem ich den aktuell ausgewählten Index abrufen und in eine Variable einfügen möchte. Jquery oder Javascript. Jquery bevorzugt.

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

$("select[name="CCards"] option:selected") sollte den Trick machen

Weitere Einzelheiten finden Sie in der jQuery-Dokumentation: http://api.jquery.com/s selected-selector/

UPDATE: falls nötig Index der ausgewählten Option müssen Sie die verwenden .index() jquery-Methode:

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

Dadurch wird der Index der ausgewählten Option bei Änderung abgerufen:

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

Wenn Sie tatsächlich nach der Indexnummer (und nicht nach dem Wert) der ausgewählten Option suchen, dann wäre dies der Fall

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

oder mit jQuery

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

der eigentliche Index ist als Eigenschaft des select-Elements verfügbar.

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

Über den Index gelangt man zur Auswahlmöglichkeit, wo man Text und Wert ziehen kann.

var opt = sel.options[sel.selectedIndex];
alert(opt.text);
alert(opt.value);

<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>

Sie können auch verwenden :checked zum <select> Elemente

z.B,

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

Sie müssen nicht einmal den Index abrufen und dann das Element über seinen Geschwisterindex referenzieren.