使用javascript的cookie问题

problems with cookies using javascript

本文关键字：问题 cookie javascript 使用      更新时间：2023-09-26

我正在创建一个非常小的购物车应用程序。用户只有两个项目可供选择，它们位于具有2行4列的表中。我想做的是用户检查项目或两个项目，输入价格，还输入金额。单击"添加到购物车"按钮后，将为每个项目单独存储一个cookie。当用户单击"查看购物车"链接时，将显示另一个表。表中显示的信息是商品名称、价格、数量以及该商品的总价。在表的下面，将显示cookie的值。我在运行程序时没有遇到任何错误，但我不知道如何将在第一个表中输入的数据显示在视图车链接的第二个表中。此外，我不知道如何显示cookie的值。这是我迄今为止掌握的代码。

<html>
<head>
<title> Store </title>
<h1> My store </h1>
<script type="text/javascript">
function setCookie() 
{
var exdate = new Date();
exdate.setDate(exdate.getDate() +10);
document.cookie = "price="+ document.getElementsByName("Price")[0].value + ";expires=  "+exdate.toGMTString();
 }
function retrieve() 
{
document.getElementsByName("fullName")[0].value = document.cookie;
}
function Calc()
{
if (document.getElementById("calcu")){
var pri = document.getElementById("price").value;
var qty = document.getElementById("quantity").value
Total(pri,qty)
}
}
function Total(pri, qty)
{
var pri = document.getElementById("price").value
var qty = document.getElementById("quantity").value
if (document.getElementById("circle").checked) {
document.getElementById("total").value = pri * qty
}
}
function load()
{
document.getElementById("circle")
}
</script>
</head>
<body>
<table border = "1">
<td> <input type="checkbox" id = "circle"> Circle </td>
<td> <img src="circle.jpg"> </td>
<td> Price: <input type = "text" size = "4"  name = "price" />$ </td>
<td> Quantity: <input type = "text" size = "4"  id = "quantity"/> </td>
<tr> </tr>
<td> <input type = "checkbox"> Stickman </td>
<td> <img src = "stickman.gif"> </td>
<td> Price: <input type = "text" size = "4" value = "$" id = "price" /> </td>
<td> Quantity: <input type = "text" size = "4"  id = "quantity" /> </td>
</table>
<br />
<input type = "button" value = "Add to cart">
<br />
<br />
<a href ="cart.html" onclick = "retrieve()"> View Cart </a>
<br /> 
</body>
</html>

这是我的另一页。

<html>
<head>
<title> Cart </title>
<h1> My cart </h1>
<script type = "text/javascript">
function retrieve() 
{
document.getElementsByName("price")[0].value = 
document.cookie;
}
</script>
</head>
<body>
<table border = "1">
<td> Stickman </td>
<td> <script type = "text/javascript">document.getElementById("price")  </script> </td> 
<td> price per </td>
<td> total </td>
<tr> </tr>
<td> Circle </td>
<td> quantity order </td>
<td> price per </td>
<td> total </td>
<tr> </tr>
<td colspan = "3"> TOTAL: </td>
<td> total price </td>
</table> 
<br /> <br />
<script type="text/javascript">document.write(retrieve("price")); 
</script>
<br / > <br />
<input type = "button" value = "Checkout">
<br /> <br />
<a href = "store.html"> Continue Shopping
</body>
</html>

如果可以，请使用jquery.cookie。

这将为你省去很多麻烦。您还可以使用ajax调用php脚本（如果您安装了服务器访问权限和php），该脚本将显示cookie值，并对服务器端的黑客行为进行一些检查。

还记得为您的cookie设置相同的域或相同的页面，否则您将在声明的页面上看到多个只读cookie。

提示：要在纯javascript上使用域或页面属性，请使用以下代码：

document.cookie = name + "=" + escape(value)+";expires="+<date of expiration in GMTString()>+";path="+path+";domain="+domain;

其中：name是您将在第二页上检索到的值的名称，价值就是你要存储的价值过期日期path是一个url路径，使用"/"并且您是系统范围的，或者使用"/cart"domain是url域，例如"www.zubzub.com"

现在在第二页，你会得到这样的cookie：

var cookie = document.cookie;
var cookies = cookie.split(";");

使用上面的内容，您可以获得存储在cookie中的所有变量。因此，您必须迭代它们，在=pos处拆分它们，这样您就可以获得一个键值对，然后您就可以处理存储在特定cookie中的真实数据。

相关文章：