obtener - Obtenga el índice de la opción seleccionada con jQuery
obtener el option de un select con jquery (7)
Los primeros métodos parecen funcionar en los navegadores que probé, pero las etiquetas de opción no corresponden realmente a los elementos reales en todos los navegadores, por lo que el resultado puede variar.
Simplemente use la propiedad selectedIndex del elemento DOM:
alert($("#dropDownMenuKategorie")[0].selectedIndex);
Actualizar:
Desde la versión 1.6 jQuery tiene el método prop que se puede usar para leer propiedades:
alert($("#dropDownMenuKategorie").prop(''selectedIndex''));
Estoy un poco confundido sobre cómo obtener un índice de una opción seleccionada de un elemento HTML <select> .
En this página hay dos métodos descritos. Sin embargo, ambos siempre regresan -1 . Aquí está mi código jQuery:
$(document).ready(function(){
$("#dropDownMenuKategorie").change(function(){
alert($("#dropDownMenuKategorie option:selected").index());
alert($("select[name=''dropDownMenuKategorie''] option:selected").index());
});
});
y en 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>
(...)
¿Por qué este comportamiento? ¿Hay alguna posibilidad de que la select no esté "lista" en el momento de asignar su método change() ? Además, cambiar .index() a .val() devuelve el valor correcto, por lo que eso me confunde aún más.
Puede obtener el índice del cuadro de selección utilizando: método .prop () de JQuery
Mira esto :
<!doctype html>
<html>
<head>
<script type="text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
function check(){
alert($("#NumberSelector").prop(''selectedIndex''));
alert(document.getElementById("NumberSelector").value);
}
</script>
</head>
<body bgcolor="yellow">
<div>
<select id="NumberSelector" onchange="check()">
<option value="Its Zero">Zero</option>
<option value="Its One">One</option>
<option value="Its Two">Two</option>
<option value="Its Three">Three</option>
<option value="Its Four">Four</option>
<option value="Its Five">Five</option>
<option value="Its Six">Six</option>
<option value="Its Seven">Seven</option>
</select>
</div>
</body>
</html>
Puede usar la función .prop(propertyName) para obtener una propiedad del primer elemento en el objeto jQuery.
var savedIndex = $(selectElement).prop(''selectedIndex'');
Esto mantiene su código dentro del dominio jQuery y también evita la otra opción de usar un selector para encontrar la opción seleccionada. Luego puedes restaurarlo usando la sobrecarga:
$(selectElement).prop(''selectedIndex'', savedIndex);
Tengo una solución ligeramente diferente basada en la respuesta de user167517. En mi función, estoy usando una variable para el ID del cuadro de selección al que estoy apuntando.
var vOptionSelect = "#productcodeSelect1";
El índice se devuelve con:
$(vOptionSelect).find(":selected").index();
Una buena manera de resolver esto en forma Jquery
$("#dropDownMenuKategorie option:selected").index()
prueba esto
alert(document.getElementById("dropDownMenuKategorie").selectedIndex);
selectedIndex es una propiedad de selección de JavaScript. Para jQuery puedes usar este código:
jQuery(document).ready(function($) {
$("#dropDownMenuKategorie").change(function() {
// I personally prefer using console.log(), but if you want you can still go with the alert().
console.log($(this).children(''option:selected'').index());
});
});