blocks|key|171211|text|检查JavaScript+Cookies+on+W3Schools.com，通过JS设置和获取Cookie值。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|171212|只需使用这里提到的setCookie和getCookie方法。|171213|因此，代码将如下所示：|171214|<script>
function+setCookie(c_name,+value,+exdays)+{
++++var+exdate+=+new+Date();
++++exdate.setDate(exdate.getDate()+%2B+exdays);
++++var+c_value+=+escape(value)+%2B+((exdays+==+null)+?+""+:+";+expires="+%2B+exdate.toUTCString());
++++document.cookie+=+c_name+%2B+"="+%2B+c_value;
}

function+getCookie(c_name)+{
++++var+i,+x,+y,+ARRcookies+=+document.cookie.split(";");
++++for+(i+=+0;+i+<+ARRcookies.length;+i%2B%2B)+{
++++++++x+=+ARRcookies[i].substr(0,+ARRcookies[i].indexOf("="));
++++++++y+=+ARRcookies[i].substr(ARRcookies[i].indexOf("=")+%2B+1);
++++++++x+=+x.replace(/%5E\s%2B%7C\s%2B$/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>|code-block|syntax|javascript|171215|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3schools.com/js/js_cookies.asp^0|2|Z|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@$A|V|B|W|1|X]]|C|$]]|$1|D|3|E|5|6|7|Y|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|Z|8|@]|9|@]|C|$]]|$1|H|3|I|5|J|7|10|8|@]|9|@]|C|$K|L]]|$1|M|3|-4|5|6|7|11|8|@]|9|@]|C|$]]]|N|$O|$5|P|Q|R|C|$S|T]]]]

Check <a href="http://www.w3schools.com/js/js_cookies.asp" rel="noreferrer">JavaScript Cookies on W3Schools.com</a> for setting and getting cookie values via JS.

Just use the setCookie and getCookie methods mentioned there.

So, the code will look something like:

<pre><code>&lt;script&gt;
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 &lt; 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");
})
&lt;/script&gt;
&lt;select id="myList" onchange="cssSelected();"&gt;
 &lt;option value="select"&gt;--Select--&lt;/option&gt;
 &lt;option value="style-1.css"&gt;CSS1&lt;/option&gt;
 &lt;option value="style-2.css"&gt;CSS2&lt;/option&gt;
 &lt;option value="style-3.css"&gt;CSS3&lt;/option&gt;
 &lt;option value="style-4.css"&gt;CSS4&lt;/option&gt;
&lt;/select&gt;
</code></pre>

blocks|key|171252|text|我相信这个问题应该有一个更通用的答案，使用一些可重用的代码，将cookies作为键值对使用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|171253|这段代码取自MDN，可能是可信的。这是用于处理cookies的UTF安全对象：|offset|length|171254|var+docCookies+=+{
++getItem:+function+(sKey)+{
++++return+decodeURIComponent(document.cookie.replace(new+RegExp("(?:(?:%5E%7C.*;)\\s*"+%2B+encodeURIComponent(sKey).replace(/[\-\.\%2B\*]/g,+"\\$&")+%2B+"\\s*\\=\\s*([%5E;]*).*$)%7C%5E.*$"),+"$1"))+%7C%7C+null;
++},
++setItem:+function+(sKey,+sValue,+vEnd,+sPath,+sDomain,+bSecure)+{
++++if+(!sKey+%7C%7C+/%5E(?:expires%7Cmax\-age%7Cpath%7Cdomain%7Csecure)$/i.test(sKey))+{+return+false;+}
++++var+sExpires+=+"";
++++if+(vEnd)+{
++++++switch+(vEnd.constructor)+{
++++++++case+Number:
++++++++++sExpires+=+vEnd+===+Infinity+?+";+expires=Fri,+31+Dec+9999+23:59:59+GMT"+:+";+max-age="+%2B+vEnd;
++++++++++break;
++++++++case+String:
++++++++++sExpires+=+";+expires="+%2B+vEnd;
++++++++++break;
++++++++case+Date:
++++++++++sExpires+=+";+expires="+%2B+vEnd.toUTCString();
++++++++++break;
++++++}
++++}
++++document.cookie+=+encodeURIComponent(sKey)+%2B+"="+%2B+encodeURIComponent(sValue)+%2B+sExpires+%2B+(sDomain+?+";+domain="+%2B+sDomain+:+"")+%2B+(sPath+?+";+path="+%2B+sPath+:+"")+%2B+(bSecure+?+";+secure"+:+"");
++++return+true;
++},
++removeItem:+function+(sKey,+sPath,+sDomain)+{
++++if+(!sKey+%7C%7C+!this.hasItem(sKey))+{+return+false;+}
++++document.cookie+=+encodeURIComponent(sKey)+%2B+"=;+expires=Thu,+01+Jan+1970+00:00:00+GMT"+%2B+(+sDomain+?+";+domain="+%2B+sDomain+:+"")+%2B+(+sPath+?+";+path="+%2B+sPath+:+"");
++++return+true;
++},
++hasItem:+function+(sKey)+{
++++return+(new+RegExp("(?:%5E%7C;\\s*)"+%2B+encodeURIComponent(sKey).replace(/[\-\.\%2B\*]/g,+"\\$&")+%2B+"\\s*\\=")).test(document.cookie);
++},
++keys:+/*+optional+method:+you+can+safely+remove+it!+*/+function+()+{
++++var+aKeys+=+document.cookie.replace(/((?:%5E%7C\s*;)[%5E\=]%2B)(?=;%7C$)%7C%5E\s*%7C\s*(?:\=[%5E;]*)?(?:\1%7C$)/g,+"").split(/\s*(?:\=[%5E;]*)?;\s*/);
++++for+(var+nIdx+=+0;+nIdx+<+aKeys.length;+nIdx%2B%2B)+{+aKeys[nIdx]+=+decodeURIComponent(aKeys[nIdx]);+}
++++return+aKeys;
++}
};|code-block|syntax|javascript|171255|Mozilla有一些测试可以证明这在所有情况下都是有效的。|171256|还有一种替代的代码片段here|171257|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/API/document.cookie|1|http://mdn.beonex.com/en/DOM/document.cookie.html^0|0|6|3|0|0|0|0|B|4|1|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Z|8|@]|9|@$D|10|E|11|1|12]]|A|$]]|$1|F|3|G|5|H|7|13|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|14|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|15|8|@]|9|@$D|16|E|17|1|18]]|A|$]]|$1|O|3|-4|5|6|7|19|8|@]|9|@]|A|$]]]|P|$Q|$5|R|S|T|A|$U|V]]|W|$5|R|S|T|A|$U|X]]]]

I'm sure this question should have a more general answer with some reusable code that works with cookies as key-value pairs.

This snippet is taken from <a href="https://developer.mozilla.org/en-US/docs/Web/API/document.cookie" rel="noreferrer">MDN</a> and probably is trustable. This is UTF-safe object for work with cookies:

<pre><code>var docCookies = {
 getItem: function (sKey) {
 return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
 },
 setItem: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) {
 if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; }
 var sExpires = "";
 if (vEnd) {
 switch (vEnd.constructor) {
 case Number:
 sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd;
 break;
 case String:
 sExpires = "; expires=" + vEnd;
 break;
 case Date:
 sExpires = "; expires=" + vEnd.toUTCString();
 break;
 }
 }
 document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : "");
 return true;
 },
 removeItem: function (sKey, sPath, sDomain) {
 if (!sKey || !this.hasItem(sKey)) { return false; }
 document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + ( sDomain ? "; domain=" + sDomain : "") + ( sPath ? "; path=" + sPath : "");
 return true;
 },
 hasItem: function (sKey) {
 return (new RegExp("(?:^|;\\s*)" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&amp;") + "\\s*\\=")).test(document.cookie);
 },
 keys: /* optional method: you can safely remove it! */ function () {
 var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
 for (var nIdx = 0; nIdx &lt; aKeys.length; nIdx++) { aKeys[nIdx] = decodeURIComponent(aKeys[nIdx]); }
 return aKeys;
 }
};
</code></pre>

Mozilla has some tests to prove this works in all cases.

There is an alternative snippet <a href="http://mdn.beonex.com/en/DOM/document.cookie.html" rel="noreferrer">here</a>:

I'm trying to set a cookie depending on which CSS file I choose in my HTML. I have a form with a list of options, and different CSS files as values. When I choose a file, it should be saved to a cookie for about a week. The next time you open your HTML file, it should be the previous file you've chosen.

JavaScript code:

<pre><code>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);
}
</code></pre>

HTML code:

<pre><code>&lt;form&gt;
 Select your css layout:&lt;br&gt;
 &lt;select id="myList"&gt;
 &lt;option value="style-1.css"&gt;CSS1&lt;/option&gt;
 &lt;option value="style-2.css"&gt;CSS2&lt;/option&gt; 
 &lt;option value="style-3.css"&gt;CSS3&lt;/option&gt;
 &lt;option value="style-4.css"&gt;CSS4&lt;/option&gt;
 &lt;/select&gt;
&lt;/form&gt;
</code></pre>

Set cookie and get cookie with JavaScript

我正在尝试根据我在HTML中选择的CSS文件来设置cookie。我有一个带有选项列表的表单，不同的CSS文件作为值。当我选择一个文件时，它应该保存到cookie中大约一周。下次打开HTML文件时，它应该是您选择的上一个文件。JavaScript代码：function cssLayout() {    document....

问使用JavaScript设置cookie和获取cookie
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用JavaScript设置cookie和获取cookieEN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用JavaScript设置cookie和获取cookie
EN