viernes, 14 de noviembre de 2014

Ejemplo de asignación de manejador de evento por live() - II

Para acabar, dejamos el código completo de esta página de ejemplo de live() en jQuery.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"
>
<html>
<head>
<title>Eventos live</title>
<style type="text/css">
.verde{color: green;}
</style>
<script src="../jquery-1.4.2.min.js"></script>
<script language="javascript">
$(document).ready(function(){
$(".verde").live("click", function(e){
var elem = $(this);
if (elem.html()!="Hiciste clic!!"){
elem.html("Hiciste clic!!");
}else{
elem.html("Hiciste de nuevo clic!!");
}
})
$("#insertarelem").click(function(e){
var nuevoElemento = $('<div class="verde">Este elemento se ha creado e insertado dinamicamente
(haz clic)</div>');
nuevoElemento.appendTo($(document.body));
});
$("#ponerclaseverde").click(function(e){
$("#noverde").addClass("verde");
});
})
</script>
</head>
<body>
<div class="verde">Esta capa tiene la clase verde (haz clic)</div>
<div class="verde">Segunda capa donde coloco la clase verde</div>
<div id="noverde">Tercera capa que no es verde</div>
<div class="verde">Otra con clase verde</div>
<input type=button value="insertar nuevo elemento verde" id="insertarelem">
<input type=button value="Poner la clase verde en el div que no la tiene" id="ponerclaseverde">
</body>
</html>

No hay comentarios:

Publicar un comentario