En este artículo, aprenderemos sobre el método .off() en jquery. JQuery es una biblioteca de javascript ligera y rápida que se utiliza para simplificar el código de javascript. Es más rápido que javascript porque la misma tarea se puede realizar más rápido usando JQuery.
Método .off() : La tarea del método .off() es eliminar un controlador de eventos del programa. Es un método incorporado en JQuery y su objetivo principal es eliminar el controlador de eventos que se adjunta al elemento HTML mediante el método on().
Sintaxis:
$( selector ).off( event, selector, function( eventObj ), map);
Dónde
- event: Especifica el evento de los elementos seleccionados.
- selector: Especifica el elemento cuyo controlador de eventos adjunto se eliminará.
- función: Especifica el nombre de la función que se ejecutará para manejar el evento y es un parámetro opcional.
- mapa: especifica un mapa de eventos que es un par clave-valor, donde la clave especifica los eventos y los valores especifican la función del controlador respectivo.
Funcionamiento: el método .off() en JQuery se usa para eliminar el controlador de eventos que está conectado al elemento HTML mediante el método on(). Entendamos con la ayuda de un ejemplo, supongamos que hay varios eventos adjuntos por el método on click() y si pasamos el método click en el método off() entonces todos los métodos click serán eliminados de la página web.
Nota: **(doble asterisco) en el método off() se usa para eliminar todos los eventos delegados de un
elemento sin eliminar los eventos no delegados.
Ejemplo:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery off() method</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>
<style>
body {
text-align: center;
}
</style>
<script>
$(document).ready(function () {
$("h2").on("click", function () {
$(this).css("background-color", "green");
});
$("button").click(function () {
$("h2").off("click");
});
});
</script>
</head>
<body>
<h2>
GeeksForGeeks(click event is active).
Click on GeeksForGeeks to see the
effect of click event.
</h2>
<button>
click here to remove the click event.
</button>
<h2>
GeeksForGeeks(This is the same element as above).
Click on the GeeksForGeeks to see the effect of
off method.
</h2>
</body>
</html>
Producción:
Explicación: A partir de la salida anterior, puede observar que después de hacer clic en el botón, el ‘evento de clic’ se eliminará de la página web. Básicamente, el trabajo de .off() es eliminar el evento de clic de la página web.
Publicación traducida automáticamente
Artículo escrito por krishnanand3 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA