Estoy tratando de configurar una cookie según el archivo CSS que elija en mi HTML. Tengo un formulario con una lista de opciones y diferentes archivos CSS como valores. Cuando elijo un archivo, debe guardarse en una cookie durante aproximadamente una semana. La próxima vez que abra su archivo HTML, debería ser el archivo anterior que haya elegido.
Código JavaScript:
function cssLayout() { document.getElementById("css").href = this.value; } function setCookie(){ var date = new Date("Februari 10, 2013"); var dateString = date.toGMTString(); var cookieString = "Css=document.getElementById("css").href" + dateString; document.cookie = cookieString; } function getCookie(){ alert(document.cookie); }Código HTML:
<form> Select your css layout:<br> <select id="myList"> <option value="style-1.css">CSS1</option> <option value="style-2.css">CSS2</option> <option value="style-3.css">CSS3</option> <option value="style-4.css">CSS4</option> </select> </form>Encuentro que el siguiente código es mucho más simple que cualquier otra cosa:
function setCookie(name,value,days) { var expires = ""; if (days) { var date = new Date(); date.setTime(date.getTime() + (days*24*60*60*1000)); expires = "; expires=" + date.toUTCString(); } document.cookie = name + "=" + (value || "") + expires + "; path=/"; } function getCookie(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; } function eraseCookie(name) { document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'; }Ahora llamando a funciones
setCookie('ppkcookie','testcookie',7); var x = getCookie('ppkcookie'); if (x) { [do something with x] }Fuente: http://www.quirksmode.org/js/cookies.html
Actualizaron la página hoy, por lo que todo en la página debería ser lo último a partir de ahora.
Estas son referencias mucho mejores que w3schools (la referencia web más horrible que se haya hecho):
Ejemplos derivados de estas referencias:
// sets the cookie cookie1 document.cookie = 'cookie1=test; expires=Sun, 1 Jan 2023 00:00:00 UTC; path=/' // sets the cookie cookie2 (cookie1 is *not* overwritten) document.cookie = 'cookie2=test; expires=Sun, 1 Jan 2023 00:00:00 UTC; path=/' // remove cookie2 document.cookie = 'cookie2=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/'La referencia de Mozilla incluso tiene una buena biblioteca de cookies que puede usar.
Verifique las cookies de JavaScript en W3Schools.com para configurar y obtener valores de cookies a través de JS.
Simplemente use los métodos setCookie y getCookie mencionados allí.
Entonces, el código se verá algo como:
<script> function setCookie(c_name, value, exdays) { var exdate = new Date(); exdate.setDate(exdate.getDate() + exdays); var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString()); document.cookie = c_name + "=" + c_value; } function getCookie(c_name) { var i, x, y, ARRcookies = document.cookie.split(";"); for (i = 0; i < ARRcookies.length; i++) { x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("=")); y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1); x = x.replace(/^\s+|\s+$/g, ""); if (x == c_name) { return unescape(y); } } } function cssSelected() { var cssSelected = $('#myList')[0].value; if (cssSelected !== "select") { setCookie("selectedCSS", cssSelected, 3); } } $(document).ready(function() { $('#myList')[0].value = getCookie("selectedCSS"); }) </script> <select id="myList" onchange="cssSelected();"> <option value="select">--Select--</option> <option value="style-1.css">CSS1</option> <option value="style-2.css">CSS2</option> <option value="style-3.css">CSS3</option> <option value="style-4.css">CSS4</option> </select>