El método die() agregado con el método live() elimina uno o más controladores de eventos para los elementos seleccionados.
Sintaxis:
$(selector).die(event, function)
Parámetro:
- event: especifica uno o más controladores de eventos para eliminar. Varios valores de eventos válidos están separados por espacios.
- función: Se utiliza para especificar una función a eliminar.
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">
</script>
<script>
function changeSize() {
$(this).animate({
fontSize: "+=3px"
});
}
function changeSpacing() {
$(this).animate({
letterSpacing: "+=2px"
});
}
$(document).ready(function() {
$("p").live("click", changeSize);
$("p").live("click", changeSpacing);
$("button").click(function() {
$("p").die("click", changeSize);
});
});
</script>
</head>
<body>
<center>
<p style="color:green;">
Geeks for geeks.
</p>
<button>
added with the live() method,
Remove the event handler changeSize(),
for p elements
</button>
</center>
</body>
</html>
Producción:
Antes de hacer clic en el párrafo:
Después de hacer clic en el párrafo:
Ejemplo-2:
<!DOCTYPE html>
<html>
<head>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">
</script>
<script>
function changeSize() {
$(this).animate({
fontSize: "+=3px"
});
}
function changeSpacing() {
$(this).animate({
letterSpacing: "+=2px"
});
}
$(document).ready(function() {
$("h1").live("click", changeSize);
$("h1").live("click", changeSpacing);
$("button").click(function() {
$("h1").die("click", changeSize);
});
});
</script>
</head>
<body>
<div>
<center>
<h1>welcome to GFG</h1>
</center>
</div>
<center>
<button>click here</button>
</center>
</body>
</html>
Antes de hacer clic en el párrafo:
Después de hacer clic en el párrafo: