JavaScript的Cookie有多个名称 javascriptcookie多个名称|JavaScri

在JavaScript中，cookie可以只包含一个名称 – 值对。然而，存储多个名称 – 值对，我们可以用下面的办法： –

序列化自定义对象的JSON字符串，解析它，然后在Cookie中保存。
对于每个名称 – 值对，使用一个单独的cookie。

在cookie存储键值对实例1
让我们看一个例子来检查cookie是否包含不止一个名称 – 值对。

< !DOCTYPE html> < html> < head> < /head> < body> Name: < input type="text" id="name">< br> Email: < input type="email" id="email">< br> Course: < input type="text" id="course">< br> < input type="button" value="http://www.srcmini.com/Set Cookie" onclick="setCookie()"> < input type="button" value="http://www.srcmini.com/Get Cookie" onclick="getCookie()"> < script> function setCookie() { //Declaring 3 key-value pairs var info="Name="+ document.getElementById("name").value+"; Email="+document.getElementById("email").value+"; Course="+document.getElementById("course").value; //Providing all 3 key-value pairs to a single cookie document.cookie=info; }function getCookie() { if(document.cookie.length!=0) { //Invoking key-value pair stored in a cookie alert(document.cookie); } else { alert("Cookie not available") } } < /script> < /body> < /html>

输出：
在点击获取Cookie的按钮，出现如下对话框。
在这里，我们可以看到，只有一个名称 – 值显示。
但是，如果你点击，获取cookie的时候没有填写表格，下面的对话框。
实例2
让我们看一个例子，不同的名称 – 值对存储在使用JSON的cookie。

< !DOCTYPE html> < html> < head> < /head> < body> Name: < input type="text" id="name">< br> Email: < input type="email" id="email">< br> Course: < input type="text" id="course">< br> < input type="button" value="http://www.srcmini.com/Set Cookie" onclick="setCookie()"> < input type="button" value="http://www.srcmini.com/Get Cookie" onclick="getCookie()">< script> function setCookie() { var obj = {}; //Creating custom object obj.name = document.getElementById("name").value; obj.email = document.getElementById("email").value; obj.course = document.getElementById("course").value; //Converting JavaScript object to JSON string var jsonString = JSON.stringify(obj); document.cookie = jsonString; } function getCookie() { if( document.cookie.length!=0) { //Parsing JSON string to JSON object var obj = JSON.parse(document.cookie); alert("Name="+obj.name+" "+"Email="+obj.email+" "+"Course="+obj.course); } else { alert("Cookie not available"); } } < /script> < /body> < /html>

输出：
在点击获取Cookie的按钮，出现如下对话框。
在这里，我们可以看到，所有存储的名称 – 值对被显示。
实例3
让我们看一个例子，每一个名称 – 值对存储在不同的Cookie。

< !DOCTYPE html> < html> < head> < /head> < body> Name: < input type="text" id="name">< br> Email: < input type="email" id="email">< br> Course: < input type="text" id="course">< br> < input type="button" value="http://www.srcmini.com/Set Cookie" onclick="setCookie()"> < input type="button" value="http://www.srcmini.com/Get Cookie" onclick="getCookie()">< script> function setCookie() { document.cookie = "name=" + document.getElementById("name").value; document.cookie = "email=" + document.getElementById("email").value; document.cookie = "course=" + document.getElementById("course").value; } function getCookie() { if (document.cookie.length != 0) { alert("Name="+document.getElementById("name").value+" Email="+document.getElementById("email").value+" Course="+document.getElementById("course").value); } else { alert("Cookie not available"); } } < /script> < /body> < /html>

输出：
在点击获取Cookie的按钮，出现如下对话框。
【JavaScript的Cookie有多个名称】在这里，我们也可以看到，所有存储的名称 – 值对被显示。