elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Estamos en la red social de Mastodon


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Obtener valor de <select> en javascript
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Obtener valor de <select> en javascript  (Leído 19,196 veces)
Geek7

Desconectado Desconectado

Mensajes: 57


Be Free!


Ver Perfil
Obtener valor de <select> en javascript
« en: 23 Diciembre 2012, 11:20 am »

Tengo este codigo pero no me anda. Me dice en la consola "Cannot read property 'value' of null ".
Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Convertidor</title>
  5. <style type="text/css">
  6. body {
  7. width: 300px;
  8. font-family: Helvetica;
  9. text-align: center;
  10. }
  11. input {
  12. border: 3px dashed #000080;
  13. }
  14. input:hover {
  15. background-color: #FFFF00;
  16. color: #000080;
  17. }
  18. #grados {
  19. display: block;
  20. padding: 0 0 8px 0;
  21. color: #C00;
  22. }
  23. </style>
  24.  
  25. <script type="text/javascript" >
  26. var grados = document.getElementById("grados");
  27. var conv = document.getElementById("opcion");
  28.  
  29. function switchLetter() {
  30. if (conv.options[conv.selectedIndex].value == 0) { // Aqui algo anda mal!!
  31. grados.innerHTML = "C";
  32. } else {
  33. grados.innerHTML = "F";
  34. }
  35. }
  36. </script>
  37. </head>
  38.  
  39. <body>
  40. <form action="ex2.php" method="post"><fieldset><legend>Convertidor</legend>
  41. <input type="text" name="grados" size="4" /> <sup>o</sup><div id="grados"></div>
  42. Convert from <select id="opcion" onchange="switchLetter()">
  43. <option value="0">Celsius a Fahr</option>
  44. <option value="1">Fahr a Celsius</option>
  45. </select></fieldset>
  46. </form>
  47. </body></html>


En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: Obtener valor de <select> en javascript
« Respuesta #1 en: 26 Diciembre 2012, 17:21 pm »

Buenas,

Tu error es que ejecutas el javascript antes de que se haya cargado el DOM por completo.

Asi, var grados = document.getElementById("grados"), intenta obtener un objeto inexistente porque todavía no se ha cargado.

2 soluciones:

1. Obtener las variables dentro de la propia funcion.
Código
  1. <script type="text/javascript">
  2. var switchLetter = function() {
  3.   var grados = document.getElementById("grados");
  4.   var conv = document.getElementById("opcion");
  5.  
  6.   if (conv.options[conv.selectedIndex].value == 0) { // Aqui algo anda mal!!
  7.      grados.innerHTML = "C";
  8.   } else {
  9.      grados.innerHTML = "F";
  10.   }
  11. }
  12. </script>

2. Declarar la función (el script entero) antes de </body>. De esta manera, primero se cargaran los elementos y luego el script.

Saludos


En línea

Draco Heroicus


Desconectado Desconectado

Mensajes: 303


Ver Perfil
Re: Obtener valor de <select> en javascript
« Respuesta #2 en: 28 Diciembre 2012, 09:27 am »

Con jQuery
Código:
var valor =  $("#id_select").val();
En línea

Draco Heroicus


Desconectado Desconectado

Mensajes: 303


Ver Perfil
Re: Obtener valor de <select> en javascript
« Respuesta #3 en: 28 Diciembre 2012, 09:29 am »

para detectar el cambio
Código:
$("#opcion").change(function(){
    //Lo que pasa al haber un cambio
   var seleccionado = $(this).val;
});
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines