HTML | DOM Seleccionar propiedad de índice seleccionado

La propiedad Seleccionar índice seleccionado en HTML DOM se usa para establecer o devolver el índice de la opción seleccionada en una lista desplegable. El índice de la lista desplegable generalmente comienza con 0 y devuelve -1 si no se selecciona ninguna opción. Esta propiedad devuelve el índice de la primera opción si la lista desplegable permite selecciones múltiples.

Sintaxis:

  • Devuelve la propiedad Seleccionar índice seleccionado.
    selectObject.selectedIndex
  • Se utiliza para establecer la propiedad Seleccionar índice seleccionado.
     selectObject.selectedIndex = number 

Valores de propiedad: contiene un número de valor único que se utiliza para especificar el índice de la opción seleccionada en una lista desplegable.

El siguiente programa ilustra la propiedad Seleccionar índice seleccionado en HTML DOM:

Ejemplo: este ejemplo utiliza la propiedad Select selectedIndex para seleccionar el elemento <option> con el índice «3».

<!DOCTYPE html>
<html>
      
<head> 
    <title>
        HTML DOM Select selectedIndex Property
    </title> 
</head>
  
<body style="text-align:center;">
  
    <h1 style="color:green;">
        GeeksforGeeks
    </h1> 
      
    <h2 style="font-family: Impact;">
        Select selectedIndex Property
    </h2><br>
      
    Select your preferred course from the drop-down list:<br>
      
    <select name="Courses Titles" id="myCourses">
        <option value="C++">c++</option>
        <option value="Placement">Placement</option>
        <option value="Java">Java</option>
        <option value="Python">Python</option>
    </select>
      
    <p>
        To select the option element with index "3",
        double-click the "Return Element" button.
    </p>
      
    <button ondblclick="myGeeks()">
        Return Element
    </button>
      
    <!-- This example uses Select selectedIndex Property -->
    <script>
        function myGeeks() {
            document.getElementById("myCourses").selectedIndex
                    = "3";
        }
    </script>
</body>
  
</html>                                                     

Salida:
Antes de hacer clic en el botón:

Después de hacer clic en el botón:

Navegadores compatibles: los navegadores compatibles con la propiedad DOM Select selectedIndex se enumeran a continuación:

  • safari de manzana
  • explorador de Internet
  • Firefox
  • Google Chrome
  • Ópera

Publicación traducida automáticamente

Artículo escrito por Shubrodeep Banerjee y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *