我正在尝试创建将两个cookie写入用户计算机的代码。 我要创建的第一个Cookie是名为“客户名称”的Cookie。处理订单时,这将存储客户的名称。 Cookie的有效期为365天。
我要创建的第一个cookie是名为“ lastvisit”的cookie,它存储了上次访问页面的日期/时间。
页面加载时将检查cookie是否存在。如果不存在,请在页面顶部打印:“欢迎新客户!”(如果确实存在),请阅读cookie数据并在页面顶部进行打印:“欢迎返回“客户名”。您最后一次访问是“最后一次访问”。
这是我的JavaScript和html的内容。 我知道我需要检查本地存储以检查cookie是否存在。 但是,我很难创建功能性cookie并检查cookie是否存在。
/*index.js*/
window.onload=initfunction;
function initfunction()
{
var toDay = new Date();
document.getElementById("datefield").innerHTML = toDay;
}
function buttonandchecks()
{
//this will use a 'for' loop to check the radio buttons and
//a series of 'if' statements to verify the check boxes
var x;
var message="";
var pizzaLine;
var pizzaType;
var pizzaSize;
var pizzaPrice;
var sandwichLine;
var samdwichsplit;
var sandwichType;
var sandwichPrice;
var sodaLine;
var sodaSplit;
var sodaSize;
var sodaPrice;
var drink;
var pizzaresultmessage="";
var toppingresultmessage="";
var totalresultmessage="";
var sandwichresultmessage="";
var sodaresultmessage="";
var nameresultmessage=document.getElementById("name").value;
var addressresultmessage=document.getElementById("address").value;
var phoneresultmessage=document.getElementById("phone").value;
var giftamount=parseFloat(0);
var orderamount=parseFloat(0);
var sodaorderamount=parseFloat(0);
var quantity = document.getElementById("quantity").value;
var sandwichquantity = document.getElementById("sandwichquantity").value;
var sodaquantity = document.getElementById("sodaquantity").value;
var radio_value; //get value from radio button
var sandwich_value;
var soda_value;
var sodatype_value;
var totalvaluepizza=parseInt(0); //initialize this to 0
var finalcost=parseInt(0);
quantity = parseFloat(quantity);
sandwichquantity = parseFloat(sandwichquantity);
sodaquantity = parseFloat(sodaquantity); //use query selector-specialty is the radio button type
////////////Trial new ways//////////////////////////
pizzaLine=document.querySelector('input[name=specialty]:checked').value;
pizzaType=pizzaLine.split(":");
pizzaSize=p.Type[0];
pizzaPrice=p.Type[1];
//parse pizzaPrice into Float to calculate Total Cost
pizzaPrice=parseFloat(pizzaPrice);
TypePizza=document.querySelector('input[name=pizzatype]:checked').value;
sandwichLine=document.querySelector('input[name=sandwichtype]:checked').value;
sandwichSplit=sandwichLine.split(":");
sandwichType=sandwichSplit[0];
sandwichPrice=sandwichSplit[1];
sandwichPrice=parseFloat(sandwichPrice);
sodaLine=document.querySelector('input[name=drinkspecialty]:checked').value;
sodaSplit=sodaLine.split(":");
sodaSize=sodaSplit[0];
sodaPrice=sodaSplit[1];
sodaPrice=parseFloat(sodaPrice);
sodaType=document.querySelector('input[name=sodatype]:checked').value;
//parse radio_value to a float
radio_value=parseFloat(radio_value);
//if statements to get the values from the check boxes
if(document.querySelector('input[name=extracheese]:checked'))
{
//giftamount+=100;//the giftamount will by increased by this value, in this case 100
//vital: you must use parseFloat to convert the values from the check boxes to number amounts
giftamount+=parseFloat(document.querySelector('input[name=cheese]:checked').value);
message=(message+"cheese ");
}
if(document.querySelector('input[name=pepperoni]:checked'))
{
//giftamount+=150;
giftamount+=parseFloat(document.querySelector('input[name=pepperoni]:checked').value);
message=(message+" Pepperoni ");
}
if(document.querySelector('input[name=mushroom]:checked'))
{
//giftamount+=175;
giftamount+=parseFloat(document.querySelector('input[name=mushroom]:checked').value);
message=(message+" Mushroom ");
}
if(document.querySelector('input[name=bacon]:checked'))
{
//giftamount+=200;
giftamount+=parseFloat(document.querySelector('input[name=bacon]:checked').value);
message=(message+" Bacon ");
}
if(document.querySelector('input[name=olives]:checked'))
{
//giftamount+=200;
giftamount+=parseFloat(document.querySelector('input[name=olives]:checked').value);
message=(message+" Olives ");
}
//calculate total cost of gift
totalvaluepizza=pizzaPrice+giftamount;
finalcost=quantity*(pizzaPrice+giftamount)+sandwichquantity*sandwichPrice+sodaquantity*sodaPrice;
pizzaresultmessage=(quantity+" "+ pizzaSize + " " + TypePizza + " Pizza "+" $ "+ quantity*pizzaPrice);
toppingresultmessage=("Extra: "+message+giftamount.toFixed(2));
totalresultmessage=("Total Cost for Pizza+Sandwich+soda: $ "+finalcost.toFixed(2));
sandwichresultmessage=(sandwichquantity+" "+ sandwichType+" $ " + sandwichquantity*sandwichPrice.toFixed(2));
sodaresultmessage=(sodaquantity+" "+ sodaSize + drink + " $ " +sodaquantity*sodaPrice.toFixed(2));
//Customer input message displayed sections
document.getElementById("showname").innerHTML=nameresultmessage;
document.getElementById("showaddress").innerHTML=addressresultmessage;
document.getElementById("showtel").innerHTML=phoneresultmessage;
document.getElementById("showpizza").innerHTML=pizzaresultmessage;
document.getElementById("showtopping").innerHTML=toppingresultmessage;
document.getElementById("showtotal").innerHTML=totalresultmessage;
document.getElementById("showsandwich").innerHTML=sandwichresultmessage;
document.getElementById("showsoda").innerHTML=sodaresultmessage;
}
//usercookie.js
$(document).ready(function() {
$("#submit").click(function() {
var username = $("#customername").val();
var userid = $("#lastvisit").val();
$.cookie('customername’', customername,{expires:365});
$.cookie('lastvisit’ ', lastvisit,{expires:365});
//display cookies values
$("#showcookies").html("Your cookies are: "+$.cookie('customername') + " and " + $.cookie('lastvisit') );
});
});
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="author" content="791894" >
<meta name="date" content="2019-03-15T22:37:02-0700" >
<script type="text/javascript" src="City Delicatessen.js"></script>
<link href="PartA.css" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Bitter|Open+Sans|Slabo+27px" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/PartA.js"></script>
</head>
<body>
<h1>Today is: <span id="dtfield" ></span></h1>
<br>
<br>
<div id="background">
<br>
<h1>Welcome to City Delicatessen </h1>
<div id="contents">
<table cellpadding="5" class="formtable">
<form name="information">
<tr><td>· First and Last Name : </td><td><input type="text" id="name" size="25" maxlength="25" autofocus="yes" pattern="[a-zA-Z]| |-|*$"></td></tr>
<tr><td>· Street Address : </td><td><input type="text" id="address" size="25" maxlength="25" pattern="[a-zA-Z0-9]| |/|,|.|\|@|#|$|%|&)+"></td></tr>
<tr><td>· Phone Number : </td><td><input type="tel" size="25" id="phone" placeholder="XXX XXX XXXX" pattern="\d{3} \d{3} \d{4}"></td></tr>
</form>
</table>
<br><br>
<form name=order>
<table style="width:100%">
<tr valign=top>
<td>
<b>Choose Pizza <b><br>
<img src="cheesepizza.jpg" alt="Forest">
<input type=radio name=pizzatype value=0.00 checked>Super Cheesy<br>
<img src="meatpizza.jpg" alt="Forest">
<input type=radio name=pizzatype value=0.00 >Extra Meaty<br>
<img src="veggypizza.jpg" alt="Forest">
<input type=radio name=pizzatype value=0.00 >Really Veggy<br>
</td>
</table>
<br>
<table>
<td>
<b>Choose Size <b><br>
<input type=radio name=specialty value=8.50 checked >Small: $8.50<br>
<input type=radio name=specialty value=11.50>Medium: $11.50<br>
<input type=radio name=specialty value=14.00>Large: $14.00<br>
<input type=radio name=specialty value=16.50>Extra Large: $16.50<br>
</td>
</table>
<table>
<br>
<tr><td>How many do you want?</td><td><input type="number" size="12" id="quantity" min="0" alt="marked"></td></tr>
</table>
<br>
<table>
<td>
<b>Choose Extra Toppings($1.75 per topping) </b><br>
<input type=radio name=cheese value=1.75 checked>Extra Cheese<br>
<input type=radio name=pepperoni value=1.75>Pepperoni<br>
<input type=radio name=mushroom value=1.75>Mushrooms<br>
<input type=radio name=bacon value=1.75>Bacon<br>
<input type=radio name=olives value=1.75>Olives<br>
</td>
</table>
</tr>
<table style="width:100%">
<tr valign=top>
<td>
<b>Choose Sandwich <b><br>
<img src="garden.jpg" alt="">
<input type=radio name=sandwichtype value=7.50 checked>All Garden Vegetarian $7.50<br>
<img src="beef.jpg" alt="">
<input type=radio name=sandwichtype value=8.50>Big Beef on a Bun $8.50<br>
<img src="mixedgrill.jpg" alt="">
<input type=radio name=sandwichtype value=9.50>Mixed Grill $9.50<br>
<img src="grilledpork.jpg" alt="">
<input type=radio name=sandwichtype value=9.50>Grilled Pork $9.50<br>
</td>
</table>
<br>
<table>
<br>
<tr><td>How many do you want?</td><td><input type="number" size="12" id="quantity" min="0"></td></tr>
</table>
<br>
<table>
<td>
<b>Choose Drinks </b><br>
<input type=radio name=drink checked>Cola<br>
<input type=radio name=drink >Orange<br>
<input type=radio name=drink >Lemon<br>
<input type=radio name=drink >Root Beer<br>
</td>
</table>
<br>
<table>
<td>
<b>Choose Size (Small: $1.25, Medium $1.75, Large: $2.00) </b><br>
<input type=radio name=drinkspecialty value=1.25 checked>Small<br>
<input type=radio name=drinkspecialty value=1.75 >Medium<br>
<input type=radio name=drinkspecialty value=2.00 >Large<br>
</td>
</table>
<table>
<br>
<tr><td>How many do you want?</td><td><input type="number" size="12" id="quantity" min="0"></td></tr>
</table>
</tr>
<br>
<br>
<button onclick="buttonandchecks()">Order Menu</button>
<h2>Order Description: </h2><h2><span id="result"></span></h2>
</form>
<h2>This program will set a session cookie and long term cookie</h2>
<form>
<table>
<tr><td>Customer Name: </td><td><input type="text" size="20" id="customername" /></td></tr>
<tr><td>Last Visit: </td><td><input type="text" size="20" id="lastvisit" /></td></tr>
</table>
<input type="button" value="Write Cookies" id="submit" />
</form>
<h2><span id="showcookies"></span>
</h2>
<br>
<h3><span id="showname"></span></h3>
<h3><span id="showaddress"></span></h3>
<h3><span id="showtel"></span></h3>
<br>
<h3><span id="showpizza"></span></h3>
<h3><span id="showtopping"></span></h3>
<h3><span id="showsandwich"></span></h3>
<h3><span id="showsoda"></span></h3>
<h3><span id="showtotal"></span></h3>
<br>
</body>
</html>`