在javascript中检索单个cookie中的多个cookie值

时间:2012-03-22 23:58:57

标签: javascript

我之前发布过这个问题,处理购物车应用程序。到目前为止,该应用程序完成了我希望它做的所有事情。我能够存储和检索cookie。但是现在,我的问题是从cookie中提取单个值并将它们放入我创建的表中。这是检索时cookie的格式。 ItemName =数量$ price。我想要做的是从cookie中检索数量和价格值,并将该数据显示在我的表中。 cookie正在我的商店页面中创建,然后检索并显示在我的购物车页面中。这是我的商店页面的代码

store.html

<html>
<head>
<title> Store </title>
<h1> My store </h1>
<script type="text/javascript">



function retr(circle)
{
var cke = document.cookie.split(';');
var nameCk= name + "=";
for(var i=0; i < cke.length; i++)
{
var c = cke [i];
while (c.charAt(0)==' ') c = c.substring(1, c.length);
if (c.indexOf(nameCk) == 0) 
return c.substring(nameCk.length, c.length);
}
return null;
}
function createCookie() 
{
var exdate = new Date();
exdate.setDate(exdate.getDate() +10);
if (document.getElementById("circle").checked)
{
document.cookie = "Circle=" + document.getElementById("quantity1").value + document.getElementById("price1").value + ";expires="+exdate.toGMTString();
}
}



function retrieve() 
{
if (document.getElementById("circle").checked)
{
document.getElementById("ret").value = document.cookie;
}
}

function Calc()
{
var fpri = document.getElementById("price1").value;
var pri = fpri.substr(1);
var qty = document.getElementById("quantity1").value;
var spri = document.getElementById("price2").value;
var pri2 = spri.substr(1);
var qty2 = document.getElementById("quantity2").value;

if (document.getElementById("circle").checked)
{
document.getElementById("total").value ='$' + Number(pri) * 
Number(qty);
}
else
document.getElementById("total").value = '$' + Number(pri2) * 
Number(qty2);
}
</script>

</head>

<body>
<table border = "1">
<tr>
<td> <input type="checkbox" id="circle" /> Circle </td>
<td> <img src="circle.jpg"> </img> </td>
<td> Price: <input type="text" size="4"   value = "$10.00" 
id="price1" name = "price1" /></td>
<td> Quantity: <input type="text" size = "4"  
id="quantity1"/></td>
</tr>
<tr>
<td> <input type = "checkbox" id="stickman" /> Stickman </td>
<td> <img src = "stickman.gif"> </img> </td>
<td> Price: <input type="text" size="4" value = "$5.00" 
id="price2" /> </td>
<td> Quantity: <input type="text" size="4"  id="quantity2" /> 
</td>
</tr>

</table>
<br />
<input type = "button" value = "Add to cart" 
onclick="createCookie()">
<br />
<br />
<a href ="cart.html" > View Cart </a>
<br /> 
<input type = "text" size = "8" id = "total" readonly = "readonly" 
/> Total
<br /> 
<input type = "button" id = "calcu" value = "calc" onclick = "Calc
()" />
<input type = "button" value = "retrieve" onclick = "retrieve()" />
<input type = "text" readonly = "readonly"  name = "ret" id = 
"ret"/>
</body>
</html>

计算和检索按钮,以及只读文本框就在那里,我知道正在存储和检索cookie,并且我能够获得总数,这将显示在我的购物车页面上。

这是我购物车页面的代码 cart.html

<html>
<head>
<title> Cart </title>
<h1> My cart </h1>
<script type = "text/javascript">

function retr(circle)
{
document.getElementById("q2").value = document.getElementById("quantity1").value

}

function retrieve() 
{
var quvalue = retr("circle")
if (quvalue != false) {
document.getElementById("q2").value = quvalue
}
document.getElementById("ret").value = document.cookie;

}


</script>
</head>

<body onload = "retrieve()">
<table border = "1">
<td>Stickman </td>
<td><input type = "text" size = "8" id = "q2" readonly = "readonly" /></td> 
<td id ="p1"> price per </td>
<td id ="t1"> 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 />
<input type ="text" id = "ret" readonly = "readonly" />
<br / > <br />
<input type = "button" value = "Checkout">
<br /> <br />
<a href = "store.html" > Continue Shopping </a>


</body>
</html>

使用onload事件属性调用应该在表中检索的值,该属性假定调用retrieve()函数。

另外,据我所知,我在购物车页面中创建表格的方式并不完全正确。但我现在主要关注的是获得必要的值以显示在我的表格中,然后我将重新改写我的表格代码。

0 个答案:

没有答案