¿Cómo puedo establecer el valor predeterminado para un elemento HTML <select>?


Answers

En caso de que desee tener un texto predeterminado como una especie de marcador de posición / sugerencia pero no se considera un valor válido (algo así como "complete aquí", "seleccione su país" ecc.) Puede hacer algo como esto:

<select>
  <option value="" selected disabled hidden>Choose here</option>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
  <option value="4">Four</option>
  <option value="5">Five</option>
</select>

Question

Pensé que agregar un atributo de "value" establecido en el elemento <select> continuación haría que la <option> contenía mi "value" proporcionado se seleccionara por defecto:

<select name="hall" id="hall" value="3">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
</select>

Sin embargo, esto no funcionó como esperaba. ¿Cómo puedo establecer qué elemento <option> está seleccionado de forma predeterminada?




Yo mismo lo uso

<select selected=''>
    <option value=''></option>
    <option value='1'>ccc</option>
    <option value='2'>xxx</option>
    <option value='3'>zzz</option>
    <option value='4'>aaa</option>
    <option value='5'>qqq</option>
    <option value='6'>wwww</option>
</select>



Puedes hacerlo así:

<select name="hall" id="hall">
    <option> 1 </option>
    <option> 2 </option>
    <option selected> 3 </option>
    <option> 4 </option>
    <option> 5 </option>
</select> 

Proporcione la palabra clave "seleccionada" dentro de la etiqueta de opción, que desea que aparezca de manera predeterminada en su lista desplegable.

O también puede proporcionar un atributo a la etiqueta de opción, es decir,

<option selected="selected">3</option>



El atributo seleccionado es un atributo booleano.

Cuando está presente, especifica que una opción debe preseleccionarse cuando se carga la página.

La opción preseleccionada se mostrará primero en la lista desplegable.

<select>
  <option value="volvo">Volvo</option>
 <option value="saab">Saab</option>
 <option value="vw">VW</option>
 <option value="audi" selected>Audi</option> 
</select> 



si desea utilizar los valores de un formulario y mantenerlo dinámico, intente esto con php

<form action="../<SamePage>/" method="post">


<?php
    $selected = $_POST['select'];
?>

<select name="select" size="1">

  <option <?php if($selected == '1'){echo("selected");}?>>1</option>
  <option <?php if($selected == '2'){echo("selected");}?>>2</option>

</select>
</form>



Este código establece el valor predeterminado para el elemento de selección HTML con PHP.

<select name="hall" id="hall">
<?php
    $default = 3;
    $nr = 1;
    while($nr < 10){
        if($nr == $default){
            echo "<option selected=\"selected\">". $nr ."</option>";
        }
        else{
            echo "<option>". $nr ."</option>";
        }
        $nr++;
    }
?>
</select>



el atributo de valor de la etiqueta falta, por lo que no se muestra como lo deseó seleccionado. De manera predeterminada, la primera opción se muestra en la carga de la página desplegable, si el atributo de valor está establecido en la etiqueta ... He resuelto mi problema de esta manera




Una mejora para la respuesta de . También puede mejorar la vista visual de la lista desplegable, ocultando el elemento 'Elegir aquí'.

<select>
  <option selected disabled hidden>Choose here</option>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
  <option value="4">Four</option>
  <option value="5">Five</option>
</select>




Related