Foros del Web » Programando para Internet » Javascript »

cambiar imagen al seleccionar en combo box

Estas en el tema de cambiar imagen al seleccionar en combo box en el foro de Javascript en Foros del Web. Tengo el siguiente codigo y no se que tengo que corregir para que al hacer click la imagen negra cambie por la seleccionada gracias!! Código ...
  #1 (permalink)  
Antiguo 28/10/2010, 20:47
 
Fecha de Ingreso: octubre-2010
Mensajes: 1
Antigüedad: 13 años, 4 meses
Puntos: 0
Pregunta cambiar imagen al seleccionar en combo box

Tengo el siguiente codigo y no se que tengo que corregir para que al hacer click la imagen negra cambie por la seleccionada

gracias!!
Código HTML:
<html>
	<script type="text/javascript">
		function cambiarImagen()
		{
		
			objImagen= document.getElementById("colores");
			alert("hola " + objImagen.value );

			objFondo= document.getElementById("marco");
			
			objFondo.src = tabla.colores.value;	 
			tabla.marco.src= tabla.colores.value;
		}
	</script>
	<body>
		<table id="tabla" name="tabla">
			<tr>
				<td>
					<select id="colores" name="colores"
 onChange="cambiarImagen()">
						<option value="rojo.jpg"> rojo 
						</option>
						<option value="azul.jpg"> azul 
						</option>
						<option value="amarillo.jpg"> 
						amarillo </option>
					</select>
				</td>
				<td>
					<img id="marco" name="marco" 
					src="negro.jpg" />
				</td>
			</tr>
		</table>
	</body>
</html> 
  #2 (permalink)  
Antiguo 28/10/2010, 22:36
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.774
Antigüedad: 16 años
Puntos: 1146
Respuesta: cambiar imagen al seleccionar en combo box

creo que deberías empezar por declarar un doctype valido.

la propiedad name no es propiamente valida para una tabla, en dado caso el input debes insertarlo en un formulario <form></form>

debería quedar algo como esto

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4.     <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
  5.     <meta name="author" content="Ag666" />
  6.  
  7.     <title>Sin título 1</title>
  8.    
  9. <script type="text/javascript">
  10.     function cambiarImagen(){
  11.         var objImagen = document.getElementById('colores');
  12.         var objFondo = document.getElementById('marco');
  13.         objFondo.src = objImagen.value;
  14.         alert('hola ' + objImagen.value );
  15.     }
  16. </script>    
  17. </head>
  18.  
  19.     <select id="colores" name="colores" onchange="cambiarImagen()">
  20.         <option value="rojo.gif">rojo</option>
  21.         <option value="azul.gif">azul</option>
  22.         <option value="negro.gif">negro</option>
  23.     </select>
  24. </form>
  25.  
  26. <img id="marco" src="negro.gif" alt="imagen de prueba" />
  27.  
  28. </body>
  29. </html>

Etiquetas: combo, combobox
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:29.