Foros del Web » Programando para Internet » Javascript »

eventos usando innerHTML

Estas en el tema de eventos usando innerHTML en el foro de Javascript en Foros del Web. Hola, lo que quiero es cambiar de color un div cuando pincho en el, y cuando pincho en el siguiente que este cambie de color ...
  #1 (permalink)  
Antiguo 23/05/2012, 08:29
 
Fecha de Ingreso: mayo-2011
Ubicación: Santiago de Compostela
Mensajes: 126
Antigüedad: 13 años
Puntos: 0
eventos usando innerHTML

Hola, lo que quiero es cambiar de color un div cuando pincho en el, y cuando pincho en el siguiente que este cambie de color y el anterior vuelva a su color original. He probado varias formas, pero lo que no se hacer y seguro que para muchos sera facil es hacer ese cambio. probe primero con sentencias if y ahora estoy usando un switch case de modo:

Código:
<script type="text/javascript">
function changeText(idElement){
switch(idElement){
	case 1:
	var unoHTML = document.getElementById('element'+idElement).innerHTML
	var dosHTML = "<span style='color:#ff0000'>" + unoHTML + "</span>"
	document.getElementById('element'+idElement).innerHTML = dosHTML
	break
	case 2: 
	var tresHTML = document.getElementById('element'+idElement).innerHTML
	var cuatroHTML = "<span style='color:#ff0000'>" + tresHTML + "</span>"
	document.getElementById('element'+idElement).innerHTML = cuatroHTML
	break
	case 3:
	var cincoHTML = document.getElementById('element'+idElement).innerHTML;
	var seisHTML = "<span style='color:#ff0000'>" + cincoHTML + "</span>"
	document.getElementById('element'+idElement).innerHTML = seisHTML
	break
		}
}
</script>
en los div uso el evento onClick
Código HTML:
<div id="element1" class="info"><?php echo $lang['text_109']; ?></div><div class="arrow"><a class="arrow" href="#" onclick="cargarContenido('uno.php'); changeText(1)"/></a></div>
<div id="element2" class="info"><?php echo $lang['text_99']; ?></div><div class="arrow"><a class="arrow" href="#" onclick="cargarContenido('dos.php'); changeText(2)"/></a></div>
<div id="element3" class="info"><?php echo $lang['text_100']; ?></div><div class="arrow"><a class="arrow" href="#" onclick="cargarContenido('tres.php');changeText(3)"/></a></div> 
lo que no se como hacer es que vuelva a su color original cuando hago click en otro div distinto.
alguien me puede decir algo. gracias.
  #2 (permalink)  
Antiguo 23/05/2012, 11:40
Avatar de 2Coder  
Fecha de Ingreso: abril-2011
Mensajes: 3
Antigüedad: 13 años
Puntos: 0
Respuesta: eventos usando innerHTML

Haría una función "reset" en javascript para que devuelva todos los divs al color original antes de poner el nuevo color al que acaba de ser clickeado. Y usaría jquery para poderlo manejar con los selectors y que asi no tengas que ir div por div en el código.
  #3 (permalink)  
Antiguo 23/05/2012, 14:34
Avatar de marlanga  
Fecha de Ingreso: enero-2011
Ubicación: Murcia
Mensajes: 1.024
Antigüedad: 13 años, 3 meses
Puntos: 206
Respuesta: eventos usando innerHTML

¿Algo como ésto?
http://jsfiddle.net/KLfuz/

Etiquetas: eventos, html, innerhtml, php
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 21:00.