PDF de programación - Solución manejadores de eventos

Imágen de pdf Solución manejadores de eventos

Solución manejadores de eventosgráfica de visualizaciones

Publicado el 20 de Mayo del 2019
63 visualizaciones desde el 20 de Mayo del 2019. Una media de 14 por semana
67,6 KB
3 paginas
Creado hace 5a (17/05/2014)
SOLUCION MANEJADORES DE EVENTOS

Crear 3 botones al hacer clic debe aparecer un mensaje de alerta.

Para lograrlo utiliza las 3 técnicas aprendidas para manejar los eventos

o Manejadores como atributos de los elementos XHTML
o Manejadores como funciones JavaScript externas.
o Manejadores "semánticos"

<html >
<head><title>Eventos Manejador semantico</title>

<script type="application/javascript">
window.onload = function()
{
document.getElementById("pinchable").onclick = muestraMensaje;
//document.form1.boton.onclick = muestraMensaje; // FUNCIONA
}
function muestraMensaje()
{
alert('Gracias por pinchar');
}
</script>

</head>
<body>
<!—Manejadores de eventos-->

<FORM name="form1">

<input type="button" value="Pinchame y verás" onclick="alert('Gracias por pinchar');" /> <br />

<input type="button" value="Pinchame y verás" onclick="muestraMensaje()" /> <br />

<input type="button" value="Pinchame y verás" id="pinchable" name="boton"/> <br />
</FORM>

</body>
</html>

<!--Manejadores como atributos de los elementos XHTML.-->

<!--Manejadores como funciones JavaScript externas. -->

<!--Manejadores "semánticos". -->

1





Modifica el siguiente código , utilizando Manejadores como funciones externas y Manejadores

semántico

document.getElementById("contenidos2").onmouseout = function(){resalta(this);}

case 'silver':
elemento.style.borderColor = 'black';
break;
case 'black':
elemento.style.borderColor = 'silver';
break;

<div id="contenidos" style="width:150px; height:60px; border:thin solid silver"
onmouseover="document.getElementById('contenidos').style.borderColor='black';"
onmouseout="document.getElementById('contenidos').style.borderColor='silver';">
Sección de contenidos...
</div>

<html>
<head><title>Eventos Manejador semantico</title>

<script type="application/javascript">
window.onload = function()
{
document.getElementById("contenidos2").onmouseover = function(){resalta(this);}

}
function resalta(elemento)
{



}
</script>

</head>
<body>

<!—Manejadores de eventos-->
<!— =============== Manejadores de eventos como atributos XHTML =================-->

<div id="contenidos" style="width:150px; height:60px; border:thin solid silver"
onmouseover="document.getElementById('contenidos').style.borderColor='black';"
onmouseout="document.getElementById('contenidos').style.borderColor='silver';">
Sección de contenidos1...
</div>


switch(elemento.style.borderColor)
{



}



2





<br /><br />

<!— =============== Manejadores de eventos como atributos XHTML : Uso this
=================-->

<div id="contenidos" style="width:150px; height:60px; border:thin solid silver"
onmouseover="this.style.borderColor='black';"
onmouseout="this.style.borderColor='silver';">
Sección de contenidos2...
</div>

<br /><br />

<!— =============== Manejadores de eventos como funciones externas =================-->

<div id="contenidos" style="width:150px; height:60px; border:thin solid silver"
onmouseover="resalta(this)"
onmouseout="resalta(this)">
Sección de contenidos3...
</div>

<br /><br />

<!— =============== Manejadores de eventos semánticos =================-->

<div id="contenidos2" style="width:150px; height:60px; border:thin solid silver" >
Sección de contenidos4...
</div>

</body>
</html>

3
  • Links de descarga
http://lwp-l.com/pdf15946

Comentarios de: Solución manejadores de eventos (0)


No hay comentarios
 

Comentar...

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

Revisar política de publicidad