Ich bin ein bisschen verwirrt darüber, wie man einen Index einer ausgewählten Option aus einem HTML abruft<select> Artikel.

Aufdiese Seite gibt es zwei Methoden beschrieben. Beide kehren jedoch immer wieder zurück-1. Hier ist mein jQuery-Code:

$(document).ready(function(){
    $("#dropDownMenuKategorie").change(function(){
        alert($("#dropDownMenuKategorie option:selected").index());
        alert($("select[name='dropDownMenuKategorie'] option:selected").index());
    });
});

und in html

(...)
<select id="dropDownMenuKategorie">
    <option value="gastronomie">Gastronomie</option>
    <option value="finanzen">Finanzen</option>
    <option value="lebensmittel">Lebensmittel</option>
    <option value="gewerbe">Gewerbe</option>
    <option value="shopping">Shopping</option>
    <option value="bildung">Bildung</option>
</select>
(...)

Warum dieses Verhalten? Gibt es eine Chance, dass dieselect ist zum Zeitpunkt der Zuweisung noch nicht "bereit"change() Methode? Zusätzlich ändern.index() zu.val() gibt den richtigen Wert zurück, und das verwirrt mich noch mehr.