Comment configurer / désactiver un cookie avec jQuery?
comment définir et désactiver un cookie en utilisant jQuery, par exemple créer un cookie nommé test
et définir la valeur à 1
?
12 réponses
voir le plugin:
https://github.com/carhartl/jquery-cookie
Vous pouvez alors:
$.cookie("test", 1);
supprimer:
$.removeCookie("test");
en outre, pour fixer un délai d'un certain nombre de jours (10 ici) sur le cookie:
$.cookie("test", 1, { expires : 10 });
si l'option expires est omise, alors le cookie devient un cookie de session et est supprimé lorsque le navigateur sortie.
pour toutes les options:
$.cookie("test", 1, {
expires : 10, // Expires in 10 days
path : '/', // The value of the path attribute of the cookie
// (Default: path of page that created the cookie).
domain : 'jquery.com', // The value of the domain attribute of the cookie
// (Default: domain of page that created the cookie).
secure : true // If set to true the secure attribute of the cookie
// will be set and the cookie transmission will
// require a secure protocol (defaults to false).
});
pour reprendre la valeur du témoin:
var cookieValue = $.cookie("test");
Vous pouvez spécifier le paramètre path si le cookie a été créé sur un chemin différent de l'actuel:
var cookieValue = $.cookie("test", { path: '/foo' });
mise à JOUR (avril 2015):
, Comme indiqué dans les commentaires ci-dessous, l'équipe qui a travaillé sur le plugin original a supprimé la dépendance de jQuery dans un nouveau projet ( https://github.com/js-cookie/js-cookie ) qui a la même fonctionnalité et syntaxe générale que la version jQuery. Apparemment, le plugin original ne va nulle part.
Il n'est pas nécessaire d'utiliser jQuery en particulier pour manipuler les cookies.
à Partir de QuirksMode (y compris échapper les caractères)
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = encodeURIComponent(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ')
c = c.substring(1, c.length);
if (c.indexOf(nameEQ) === 0)
return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
return null;
}
function eraseCookie(name) {
createCookie(name, "", -1);
}
regardez
<script type="text/javascript">
function setCookie(key, value) {
var expires = new Date();
expires.setTime(expires.getTime() + (1 * 24 * 60 * 60 * 1000));
document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
}
function getCookie(key) {
var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
return keyValue ? keyValue[2] : null;
}
</script>
vous pouvez configurer les cookies comme
setCookie('test','1');
vous pouvez obtenir les cookies comme
getCookie('test');
Espère qu'il vous aide à quelqu'un :)
EDIT:
si vous voulez enregistrer le chemin de cookie pour la page d'accueil alors faire comme
function setCookie(key, value) {
var expires = new Date();
expires.setTime(expires.getTime() + (1 * 24 * 60 * 60 * 1000));
document.cookie = key + '=' + value +';path=/'+ ';expires=' + expires.toUTCString();
}
Merci, vicky
Vous pouvez utiliser un plugin disponible ici..
https://plugins.jquery.com/cookie /
, puis d'écrire un cookie
$.cookie("test", 1);
pour accéder au cookie
$.cookie("test");
Voici mon module global que j'utilise -
var Cookie = {
Create: function (name, value, days) {
var expires = "";
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
}
document.cookie = name + "=" + value + expires + "; path=/";
},
Read: function (name) {
var nameEQ = name + "=";
var ca = document.cookie.split(";");
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == " ") c = c.substring(1, c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
}
return null;
},
Erase: function (name) {
Cookie.create(name, "", -1);
}
};
assurez-vous de ne pas faire quelque chose comme ceci:
var a = $.cookie("cart").split(",");
alors, si le cookie n'existe pas, le débogueur retournera un message inutile comme ".cookie pas une fonction".
déclarez toujours en premier, puis faites la division après avoir vérifié pour null. Comme ceci:
var a = $.cookie("cart");
if (a != null) {
var aa = a.split(",");
un exemple simple de cookie de configuration dans votre navigateur:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery.cookie Test Suite</title>
<script src="jquery-1.9.0.min.js"></script>
<script src="jquery.cookie.js"></script>
<script src="JSON-js-master/json.js"></script>
<script src="JSON-js-master/json_parse.js"></script>
<script>
$(function() {
if ($.cookie('cookieStore')) {
var data=JSON.parse($.cookie("cookieStore"));
$('#name').text(data[0]);
$('#address').text(data[1]);
}
$('#submit').on('click', function(){
var storeData = new Array();
storeData[0] = $('#inputName').val();
storeData[1] = $('#inputAddress').val();
$.cookie("cookieStore", JSON.stringify(storeData));
var data=JSON.parse($.cookie("cookieStore"));
$('#name').text(data[0]);
$('#address').text(data[1]);
});
});
</script>
</head>
<body>
<label for="inputName">Name</label>
<br />
<input type="text" id="inputName">
<br />
<br />
<label for="inputAddress">Address</label>
<br />
<input type="text" id="inputAddress">
<br />
<br />
<input type="submit" id="submit" value="Submit" />
<hr>
<p id="name"></p>
<br />
<p id="address"></p>
<br />
<hr>
</body>
</html>
il suffit de copier/coller et d'utiliser ce code pour définir votre cookie.
vous pouvez utiliser la bibliothèque sur le site de Mozilla ici
vous serez en mesure de définir et d'obtenir des cookies comme ceci
docCookies.setItem(name, value);
docCookies.getItem(name);
je pense que Fresher nous a donné le bon chemin, mais il y a une erreur:
<script type="text/javascript">
function setCookie(key, value) {
var expires = new Date();
expires.setTime(expires.getTime() + (value * 24 * 60 * 60 * 1000));
document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
}
function getCookie(key) {
var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
return keyValue ? keyValue[2] : null;
}
</script>
vous devez ajouter "value" près de getTime (); sinon le cookie expirera immédiatement :)
Voici comment vous définissez le cookie avec jQuery:
le code ci-dessous est tiré de https://www.w3schools.com/js/js_cookies.asp
function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays*24*60*60*1000)); var expires = "expires="+ d.toUTCString(); document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; }
maintenant vous pouvez obtenir le cookie avec la fonction ci-dessous:
function getCookie(cname) { var name = cname + "="; var decodedCookie = decodeURIComponent(document.cookie); var ca = decodedCookie.split(';'); for(var i = 0; i <ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return ""; }
et enfin voici comment vous vérifiez le cookie:
function checkCookie() { var username = getCookie("username"); if (username != "") { alert("Welcome again " + username); } else { username = prompt("Please enter your name:", ""); if (username != "" && username != null) { setCookie("username", username, 365); } } }
si vous voulez supprimer le cookie juste régler le paramètre expires à une date passée:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
j'ai pensé Vignesh Pichamani ' S réponse était le plus simple et le plus propre. Ajoutant juste à sa capacité de fixer le nombre de jours avant l'expiration:
EDIT: également ajouté" never expires "option si aucun numéro de jour est défini
function setCookie(key, value, days) {
var expires = new Date();
if (days) {
expires.setTime(expires.getTime() + (days * 24 * 60 * 60 * 1000));
document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
} else {
document.cookie = key + '=' + value + ';expires=Fri, 30 Dec 9999 23:59:59 GMT;';
}
}
function getCookie(key) {
var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
return keyValue ? keyValue[2] : null;
}
règle le cookie:
setCookie('myData', 1, 30); // myData=1 for 30 days.
setCookie('myData', 1); // myData=1 'forever' (until the year 9999)
$.cookie("test", 1); //set cookie
$.cookie("test"); //get cookie
$.cookie('test', null); //delete cookie