Skip to main content
se añadieron 91 caracteres en el cuerpo
Origen Enlace
Orici
  • 7.8k
  • 13
  • 50
  • 89

Tienes que mover el javascript al final de la pagina para poder lograrlo:

<input type="text" id="mytext">

<select id="dropdown" >

  <option value="">None</option>
  <option value="text1">text1</option>
  <option value="text2">text2</option>
  <option value="text3">text3</option>
  <option value="text4">text4</option>
</select>

<script text=javascript>
var select = document.getElementById('dropdown');
select.addEventListener('change', function(event) {
  var select = event.target;
  var indiceSeleccionado = select.selectedIndex;
  var elementoSeleccionado = select.options[indiceSeleccionado];
  var texto = document.getElementById('mytext');

  texto.value = select.value;

})
</script>

La ejecucion del codigoEl código de la paginapágina se ejecuta ena modo de cascada, comenzando desdede arriba hacia final de la paginaabajo según esta se carga. EnCuando un código javascript se carga y ejecuta antes que el elemento al que hace referencia este no puede encontrarse, entonces, tu codigocódigo var select = document.getElementById('dropdown'); se ejecuta antes de que el propio select siquieraselect se haya renderizado y por eso no lo puede encontrar.

Tienes que mover el javascript al final de la pagina para poder lograrlo:

<input type="text" id="mytext">

<select id="dropdown" >

  <option value="">None</option>
  <option value="text1">text1</option>
  <option value="text2">text2</option>
  <option value="text3">text3</option>
  <option value="text4">text4</option>
</select>

<script text=javascript>
var select = document.getElementById('dropdown');
select.addEventListener('change', function(event) {
  var select = event.target;
  var indiceSeleccionado = select.selectedIndex;
  var elementoSeleccionado = select.options[indiceSeleccionado];
  var texto = document.getElementById('mytext');

  texto.value = select.value;

})
</script>

La ejecucion del codigo de la pagina se ejecuta en modo cascada, comenzando desde arriba hacia final de la pagina. En tu codigo var select = document.getElementById('dropdown'); se ejecuta antes de que el propio select siquiera se haya renderizado y por eso no lo puede encontrar.

Tienes que mover el javascript al final de la pagina para poder lograrlo:

<input type="text" id="mytext">

<select id="dropdown" >

  <option value="">None</option>
  <option value="text1">text1</option>
  <option value="text2">text2</option>
  <option value="text3">text3</option>
  <option value="text4">text4</option>
</select>

<script text=javascript>
var select = document.getElementById('dropdown');
select.addEventListener('change', function(event) {
  var select = event.target;
  var indiceSeleccionado = select.selectedIndex;
  var elementoSeleccionado = select.options[indiceSeleccionado];
  var texto = document.getElementById('mytext');

  texto.value = select.value;

})
</script>

El código de la página se ejecuta a modo de cascada, de arriba hacia abajo según esta se carga. Cuando un código javascript se carga y ejecuta antes que el elemento al que hace referencia este no puede encontrarse, entonces, tu código var select = document.getElementById('dropdown'); se ejecuta antes de que el select se haya renderizado y por eso no lo puede encontrar.

Origen Enlace
Einer
  • 20.6k
  • 2
  • 17
  • 39

Tienes que mover el javascript al final de la pagina para poder lograrlo:

<input type="text" id="mytext">

<select id="dropdown" >

  <option value="">None</option>
  <option value="text1">text1</option>
  <option value="text2">text2</option>
  <option value="text3">text3</option>
  <option value="text4">text4</option>
</select>

<script text=javascript>
var select = document.getElementById('dropdown');
select.addEventListener('change', function(event) {
  var select = event.target;
  var indiceSeleccionado = select.selectedIndex;
  var elementoSeleccionado = select.options[indiceSeleccionado];
  var texto = document.getElementById('mytext');

  texto.value = select.value;

})
</script>

La ejecucion del codigo de la pagina se ejecuta en modo cascada, comenzando desde arriba hacia final de la pagina. En tu codigo var select = document.getElementById('dropdown'); se ejecuta antes de que el propio select siquiera se haya renderizado y por eso no lo puede encontrar.