Setze und lösche ein Cookie in jQuery
-
Cookie erstellen und löschen mit
jquery-cookie
in jQuery - Erstellen und löschen Sie ein Cookie mit einer benutzerdefinierten Funktion in jQuery
Dieser Artikel lehrt zwei Beispiele, wie man ein Cookie mit jQuery setzt und löscht. Im ersten Beispiel verwenden Sie ein Plugin namens jquery-cookie
, das Sie von GitHub erhalten können.
Das zweite Beispiel verwendet eine benutzerdefinierte Funktion zum Erstellen und Löschen des Cookies.
Cookie erstellen und löschen mit jquery-cookie
in jQuery
Das Plugin jquery-cookie
ermöglicht es Ihnen, Cookies in Ihrem Webbrowser zu erstellen und zu löschen. Das Plugin hat zwei Funktionen, die dies ermöglichen; sie sind $.cookie()
und $.removeCookie()
.
Mit der Funktion $.cookie()
können Sie den Cookie-Namen und seine Parameter festlegen. Während die Funktion $.removeCookie()
das Cookie löscht.
Sie können jquery-cookie
von ihrem GitHub-Repo erhalten; Danach speichern Sie es in Ihrem Arbeitsverzeichnis. Stellen Sie von dort aus sicher, dass Sie auch jQuery verknüpft haben.
Der folgende Code enthält Details zur Verwendung von jquery-cookie
zum Setzen und Löschen eines Cookies.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>01-jQuery-set-cookie</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js" integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</head>
<body>
<script type="text/javascript" src="js/jquery-cookie.js"></script>
<script>
// Define a cookie called DelftStack_Cookie
// and set its value to 4500.
$.cookie("DelfStack_Cookie", 4500);
let cookie_value = $.cookie("DelfStack_Cookie");
/* Remove the cookie
$.removeCookie("DelfStack_Cookie");*/
</script>
</body>
</html>
Ausgabe (beachten Sie die Browserkonsole):
Erstellen und löschen Sie ein Cookie mit einer benutzerdefinierten Funktion in jQuery
Eine benutzerdefinierte Funktion, die die Zeit berechnet und die Methode document.cookie()
verwendet, kann ein Cookie setzen und löschen. Anschließend verwenden Sie die Zeitberechnung, um das Ablaufdatum des Cookies zu ermitteln.
Dazu benötigen Sie die Objektmethoden Date
; diese sind setTime()
, getTime()
und toGMTString()
. Außerdem maskieren Sie Zeichen im Cookie-Namen mit encodeURIComponent
.
Im folgenden Code finden Sie die benutzerdefinierte Funktion, mit der Sie ein Cookie setzen können. Aber wir haben den Code, der ein Cookie löschen kann, als Kommentar hinterlassen.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>02-jQuery-set-cookie</title>
</head>
<body>
<script>
function create_cookie(cookie_name, cookie_value, cookie_life_time) {
let cookie_expires;
if (cookie_life_time) {
let current_date = new Date();
let current_time = current_date.getTime();
current_date.setTime(current_time + (cookie_life_time * 24 * 60 * 60 * 1000));
cookie_expires = "; expires=" + current_date.toGMTString();
} else {
cookie_expires = "";
}
document.cookie = encodeURIComponent(cookie_name) + "=" + encodeURIComponent(cookie_value) + cookie_expires + "; path=/";
}
create_cookie('Habdul Hazeez', '14092022', 1);
/* Erase the stored cookie
function erase_cookie(cookie_name) {
create_cookie(cookie_name, "", -1);
}*/
</script>
</body>
</html>
Ausgabe (beachten Sie die Browserkonsole):
Habdul Hazeez is a technical writer with amazing research skills. He can connect the dots, and make sense of data that are scattered across different media.
LinkedIn