在JS中编写和检索Cookie

时间:2015-04-28 20:39:18

标签: javascript cookies

好吧,所以我为我的班级做了这个任务,我不完全确定我做错了什么。我需要在调用initPage()的sbutton中插入saveMailingInfo()函数,并且必须在页面加载时运行。我还需要编写一个saveMailingInfo()函数,该函数创建一个3年的到期日期并循环遍历邮件表单的每个元素。我确信我做得对,但是当我测试它时我没有得到警报。有什么想法吗?

/* this function attachs the event handler under both event models */
function addEvent(object, evName, fnName, cap) {
	if (object.attachEvent)
		object.attachEvent("on" + evName, fnName);
	else if (object.addEventListener)
		object.addEventListener(evName, fnName, cap);
}



function writeCookie(cName, cValue, expDate, cPath, cDomain, cSecure) {
  if (cName && cValue != "") {
     var cString = cName + "=" + escape(cValue);
     if (expDate) 
        cString += ";expires=" + expDate.toGMTString();

     if (cPath) cString += ";path=" + cPath;
     if (cDomain) cString += ";domain=" + cDomain;
     if (cSecure) cString += ";secure";


     document.cookie = cString;
  }


function saveMailingInfo() {

  var expire = new Date();
  expire.setFullYear(expire.getFullYear() + 3);

  var allFields = document.mailingForm.elements;
  for (var i  = 0; i < allFields.length; i++) {

    if (allFields[i].type == "text") {

      writeCookie(allFields[i].id, allFields[i].value, expire);

    }

    if (allFields[i].nodename == "SELECT") {

      writeCookie(allFields[i].id, allFields[i].selectedIndex, expire);

    }

    if (allFields[i].type == "radio") || allFields[i].type == "checkbox") {

  writeCookie(allFields[i].id, allFields[i].checked, expire);

}

  }


}

  alert("Cookie has been written!");
}

addEvent(window, "load", initpage, false);

  function initPage(){

    document.getElementById("sbutton").onclick = saveMailingInfo;
    console.log(document.cookie);

  
  }
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- DW6 -->
<head>
<!-- 
 


-->
<title>Cakes by Emily</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="main.css" type="text/css" />
   <script type="text/javascript" src="cakeForm.js"></script>

</head>
<body >
<div class="head" id="header">
  <p><img src="cake.jpg" alt="cake picture" /><img src="logo.gif" alt="Cakes by Emily" width="400" height="125" /></p>
  <div class="links" id="navigation">
    <a href="#">Home</a>
    <a href="#">Cakes</a>
    <a href="#">Pastries</a>
    <a href="#">Pies</a>
    <a href="#">Mailing List</a>
  </div>
</div>
<div class="mainContent">
<p>Enter your info to be added to our email list with reminders about getting that birthday 
cake you want! Remember at Cakes by Emily, we aim to make every birthday the best!</p>
<form name="mailingForm" >
 <table>
  <tr>
   <td>
  First:

   </td>
   <td> <input type="text" name="firstName"  id="firstName"><BR>
  </td>
 </tr>
  <tr>
   <td>
  Last: 
   </td>
   <td><input type="text" name="lastName" id="lastName" ><BR>
  </td>
 </tr>
  <tr>
   <td>
  E-Mail: 

   </td>
   <td><input type="text" name="email" id="email" ><BR>
  </td>
 </tr>
  <tr>
   <td>
  Birthday (mm/dd/yyyy): 

   </td>
   <td><input type="text" name="birthday" id="birthday" ><BR>
  </td>
 </tr>
  <tr>
   <td>
  Favorite Cake: 

   </td>
   <td>
    <select id="favoriteCake">
     <option value="ButterCream">Butter Cream</option>
     <option value="Chocolate">Chocolate</option>
     <option value="Vanilla">Vanilla</option>
     <option value="RedVelvet">Red Velvet</option>
   </select><BR>
  </td>
 </tr>
  <tr>
   <td>
  Frequency of Emails: 

   </td>
   <td><input type="radio" name="frequency" id="frequency1" >Email me monthly<BR>
       <input type="radio" name="frequency" id="frequency2" >Email me quarterly<BR>
       <input type="radio" name="frequency" id="frequency3" >Email me near my birthday<BR>
  </td>
 </tr>
</table>
<input type="submit" id="sbutton" name="sbutton"  value="Join our mailing List" />
<input type="reset" value="Reset the form" />
</form>
</div>
<div class="footer">
</div>
</body>
</html>

0 个答案:

没有答案