cómo almacenar una matriz en jquery cookie?

Necesito almacenar una matriz en una cookie jQuery, ¿alguien me puede ayudar, por favor?

Todavía no estoy exactamente seguro de lo que necesita, pero espero que esto ayude. Esta es una muestra que le permitirá acceder a los artículos en cualquier página, ¡es solo una muestra! Utiliza el cookieName para identificarlo en las páginas.

//This is not production quality, its just demo code. var cookieList = function(cookieName) { //When the cookie is saved the items will be a comma seperated string //So we will split the cookie by comma to get the original array var cookie = $.cookie(cookieName); //Load the items or a new array if null. var items = cookie ? cookie.split(/,/) : new Array(); //Return a object that we can use to access the array. //while hiding direct access to the declared items array //this is called closures see http://www.jibbering.com/faq/faq_notes/closures.html return { "add": function(val) { //Add to the items. items.push(val); //Save the items to a cookie. //EDIT: Modified from linked answer by Nick see // http://stackoverflow.com/questions/3387251/how-to-store-array-in-jquery-cookie $.cookie(cookieName, items.join(',')); }, "remove": function (val) { //EDIT: Thx to Assef and luke for remove. indx = items.indexOf(val); if(indx!=-1) items.splice(indx, 1); $.cookie(cookieName, items.join(',')); }, "clear": function() { items = null; //clear the cookie. $.cookie(cookieName, null); }, "items": function() { //Get all the items. return items; } } } 

Entonces en cualquier página puedes obtener los artículos como este.

 var list = new cookieList("MyItems"); // all items in the array. 

Agregar elementos a cookieList

 list.add("foo"); //Note this value cannot have a comma "," as this will spilt into //two seperate values when you declare the cookieList. 

Obtener todos los elementos como una matriz

 alert(list.items()); 

Limpiando los artículos

 list.clear(); 

Puede agregar cosas adicionales como pulsar y abrir fácilmente. Nuevamente espero que esto ayude.

EDITAR Vea la respuesta bravos si tiene problemas con IE

Descargue el complemento de cookies jQuery aquí: http://plugins.jquery.com/project/Cookie

Configurar una cookie con jQuery es tan simple como esto, donde estamos creando una cookie llamada “ejemplo” con un valor de [“foo1”, “foo2”]

 $.cookie("example", ["foo1", "foo2"]); 

Obtener el valor de la cookie también es muy fácil con jQuery. Lo siguiente mostraría el valor de la cookie “ejemplo” en una ventana de diálogo

 alert( $.cookie("example") ); 

Mira mi implementación (como un plugin jquery):

 (function ($) { $.fn.extend({ cookieList: function (cookieName) { var cookie = $.cookie(cookieName); var items = cookie ? eval("([" + cookie + "])") : []; return { add: function (val) { var index = items.indexOf(val); // Note: Add only unique values. if (index == -1) { items.push(val); $.cookie(cookieName, items.join(','), { expires: 365, path: '/' }); } }, remove: function (val) { var index = items.indexOf(val); if (index != -1) { items.splice(index, 1); $.cookie(cookieName, items.join(','), { expires: 365, path: '/' }); } }, indexOf: function (val) { return items.indexOf(val); }, clear: function () { items = null; $.cookie(cookieName, null, { expires: 365, path: '/' }); }, items: function () { return items; }, length: function () { return items.length; }, join: function (separator) { return items.join(separator); } }; } }); })(jQuery); 

Uso:

  var cookieList = $.fn.cookieList("cookieName"); cookieList.add(1); cookieList.add(2); cookieList.remove(1); var index = cookieList.indexOf(2); var length = cookieList.length(); 

Recibí el error cuando bash usar el script de almog.ori en IE 8

  //This is not production quality, its just demo code. var cookieList = function(cookieName) { //When the cookie is saved the items will be a comma seperated string //So we will split the cookie by comma to get the original array var cookie = $.cookie(cookieName); //Load the items or a new array if null. var items = cookie ? cookie.split(/,/) : new Array(); //Return a object that we can use to access the array. //while hiding direct access to the declared items array //this is called closures see http://www.jibbering.com/faq/faq_notes/closures.html return { "add": function(val) { //Add to the items. items.push(val); //Save the items to a cookie. //EDIT: Modified from linked answer by Nick see // https://stackoverflow.com/questions/3387251/how-to-store-array-in-jquery-cookie $.cookie(cookieName, items.join(',')); }, "remove": function (val) { //EDIT: Thx to Assef and luke for remove. indx = items.indexOf(val); if(indx!=-1) items.splice(indx, 1); $.cookie(cookieName, items.join(',')); }, "clear": function() { items = null; //clear the cookie. $.cookie(cookieName, null); }, "items": function() { //Get all the items. return items; } } } 

después de unas pocas horas cavando el error, solo me di cuenta de que indexOf in

 "remove": function (val) { //EDIT: Thx to Assef and luke for remove. indx = items.indexOf(val); if(indx!=-1) items.splice(indx, 1); $.cookie(cookieName, items.join(',')); }, 

no es compatible en IE 8.

y entonces agrego otra base de código desde aquí Cómo arreglar Array indexOf () en JavaScript para navegadores Internet Explorer

funciona,

 "remove": function (val) { //EDIT: Thx to Assef and luke for remove. /** indexOf not support in IE, and I add the below code **/ if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(obj, start) { for (var i = (start || 0), j = this.length; i < j; i++) { if (this[i] === obj) { return i; } } return -1; } } var indx = items.indexOf(val); if(indx!=-1) items.splice(indx, 1); //if(indx!=-1) alert('lol'); $.cookie(cookieName, items.join(',')); }, 

En caso de que alguien descubriera que el script no funciona en IE 8, podría ser útil.

No sé si esto ayudará a alguien, pero también necesitaba la función que verifica si el elemento ya está allí, así que no lo vuelvo a agregar.

Usé la misma función de eliminación y la alteré para que sea función de contener:

 "contain": function (val) { //Check if an item is there. if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(obj, start) { for (var i = (start || 0), j = this.length; i < j; i++) { if (this[i] === obj) { return i; } } return -1; }; } var indx = items.indexOf(val); if(indx>-1){ return true; }else{ return false; } }, 

por alguna razón, el código anterior no siempre funciona. así que aquí está el nuevo que funciona:

 "contain": function (val) { //Check if an item is there. if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(obj, start) { for (var i = (start || 0), j = this.length; i < j; i++) { if (this[i] === obj) { return i; } } return -1; }; } var indx = items.join(',').indexOf(val); if(indx > -1){ return true; }else{ return false; } }, 

Esta implementación proporciona acceso independiente para múltiples controles en la página:

 (function ($) { $.fn.extend({ cookieList: function (cookieName) { return { add: function (val) { var items = this.items(); var index = items.indexOf(val); // Note: Add only unique values. if (index == -1) { items.push(val); $.cookie(cookieName, items.join(','), { expires: 365, path: '/' }); } }, remove: function (val) { var items = this.items(); var index = items.indexOf(val); if (index != -1) { items.splice(index, 1); $.cookie(cookieName, items.join(','), { expires: 365, path: '/' }); } }, indexOf: function (val) { return this.items().indexOf(val); }, clear: function () { $.cookie(cookieName, null, { expires: 365, path: '/' }); }, items: function () { var cookie = $.cookie(cookieName); return cookie ? eval("([" + cookie + "])") : []; ; }, length: function () { return this.items().length; }, join: function (separator) { return this.items().join(separator); } }; } }); })(jQuery); 

Ajusté ligeramente el ejemplo para usar la encoding JSON y la deencoding secureJSON, haciéndolo más robusto y más seguro.

Depende de https://code.google.com/p/jquery-json/

 /* * Combined with: * http://www.terminally-incoherent.com/blog/2008/11/25/serializing-javascript-objects-into-cookies/ * With: * https://code.google.com/p/jquery-json/ * */ (function ($) { $.fn.extend({ cookieList: function (cookieName, expireTime) { var cookie = $.cookie(cookieName); var items = cookie ? $.secureEvalJSON(cookie) : []; return { add: function (val) { var index = items.indexOf(val); // Note: Add only unique values. if (index == -1) { items.push(val); $.cookie(cookieName, $.toJSON(items), { expires: expireTime, path: '/' }); } }, remove: function (val) { var index = items.indexOf(val); if (index != -1) { items.splice(index, 1); $.cookie(cookieName, $.toJSON(items), { expires: expireTime, path: '/' }); } }, indexOf: function (val) { return items.indexOf(val); }, clear: function () { items = null; $.cookie(cookieName, null, { expires: expireTime, path: '/' }); }, items: function () { return items; }, length: function () { return items.length; }, join: function (separator) { return items.join(separator); } }; } }); })(jQuery); 

Un buen pedazo de código para lo que estoy haciendo en este momento, pero encontré un error. Estaba guardando una lista de enteros (ID) en la cookie. Sin embargo, cuando la cookie se lee por primera vez, se transforma en cadenas. Anteriormente guardo (int) 1, y más tarde cuando la cookie se recupera en una página, recargar lo designa como “1”. Por lo tanto, cuando bash eliminar (int) 1 de la lista, no indexará una coincidencia.

La solución que apliqué es cambiar las expresiones “val” a val.toString () antes de agregar o indexar los elementos. Por lo tanto, items es una matriz de cadenas.

 "add": function(val) { //Add to the items. items.push(val.toString()); //Save the items to a cookie. $.cookie(cookieName, items.join(',')); }, "remove": function (val) { //EDIT: Thx to Assef and luke for remove. if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(obj, start) { for (var i = (start || 0), j = this.length; i < j; i++) { if (this[i] === obj) { return i; } } return -1; }; } var indx = items.indexOf(val.toString()); if(indx!=-1) items.splice(indx, 1); //Save the items to a cookie. $.cookie(cookieName, items.join(',')); }, 

Así es como almacena y recupera una matriz en una cookie usando json y jquery.

 //Array var employees = [ {"firstName" : "Matt", "lastName" : "Hendi"}, {"firstName" : "Tim", "lastName" : "Rowel"} ]; var jsonEmployees = JSON.stringify(employees);//converting array into json string $.cookie("employees", jsonEmployees);//storing it in a cookie var empString = $.cookie("employees");//retrieving data from cookie var empArr = $.parseJSON(empString);//converting "empString" to an array. 

Agregué la acción "remove" a quien quiera usarlo – val es el índice en el cual comenzar a cambiar la matriz:

  "remove": function (val) { items.splice(val, 1); $.cookie(cookieName, items.join(',')); } 

solo una pequeña alternativa a la función "remove" :

  "removeItem": function (val) { indx = items.indexOf(val); if(indx!=-1) items.splice(indx, 1); $.cookie(cookieName, items.join(',')); } 

donde val es el valor de un elemento en la matriz, por ejemplo:

  >>> list.add("foo1"); >>> list.add("foo2"); >>> list.add("foo3"); >>> list.items(); ["foo1", "foo2", "foo3"]; >>> list.removeItem("foo2"); >>> list.items(); ["foo1", "foo3"]; 

Puede serializar las matrices antes de almacenarlas como cookies y luego deserializarlas al leerlas. es decir, con json?

Aquí está la implementación de JSON para trabajar con cookies, una forma mucho mejor para almacenar matrices . probado desde mi extremo

 $.fn.extend({ cookieList: function (cookieName) { var cookie = $.cookie(cookieName); var storedAry = ( cookie == null ) ? [] : jQuery.parseJSON( cookie ); return { add: function (val) { var is_Arr = $.isArray( storedAry ); //console.log(storedAry); if( $.inArray(val, storedAry) === -1 ){ storedAry.push(val); //console.log('inside'); } $.cookie( cookieName, JSON.stringify(storedAry), { expires : 1 , path : '/'}); /*var index = storedAry.indexOf(val); if (index == -1) { storedAry.push(val); $.cookie(cookieName, storedAry.join(','), { expires: 1, path: '/' }); }*/ }, remove: function (val) { storedAry = $.grep(storedAry, function(value) { return value != val; }); //console.log('Removed '+storedAry); $.cookie( cookieName, JSON.stringify(storedAry), { expires : 1 , path : '/'}); /*var index = storedAry.indexOf(val); if ( index != -1 ){ storedAry.splice( index, 1 ); $.cookie(cookieName, storedAry.join(','), { expires: 1, path: '/' }); }*/ } clear: function () { storedAry = null; $.cookie(cookieName, null, { expires: 1, path: '/' }); } }; } 

});