Tanımlama bilgileri (ve krem) Javascript kullanarak yazma

Form aracılığıyla girilen değerleri kullanarak çerez yazmam gereken bir ödev üzerinde çalışıyorum ve açılan menüden seçilen değeri nasıl alacağımı anlayamıyorum Çerez olarak kaydetmek için menü.Tanımlama bilgileri (ve krem) Javascript kullanarak yazma

JavaScript

/* 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() + 1); 
     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("Registration data saved"); 
    } 

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

    function initPage(){ 
     document.getElementById("sbutton").onclick = saveMailingInfo; 
     document.getElementById("favoriteCake").selectedIndex = retrieveCookie("favoriteCake"); 
    }

HTML

<!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>

kaynak

2016-04-01 user320521

kullanımı bir HTML select seçilen öğenin değerini almak için:

var cake = document.getElementById("favoriteCake"); 
var cakeValue = cake.options[cake.selectedIndex].value;

Ben de yardım edemem

ancak ihbar if ifadelerinizin çoğunun isteğe bağlı kıvırcıkdan yararlandığını İşte

if (object.attachEvent) 
     object.attachEvent("on" + evName, fnName); 
    else if (object.addEventListener) 
     object.addEventListener(evName, fnName, cap);

bunu yapmaması gereken neden iyi bir örnektir:: dal yalnızca bir deyim içeriyorsa parantezi

Bu cPath sonra, kod true ise gibi yapar

if (cPath) cString += ";path=" + cPath;

aynı satırda izlenenler yürütülür, ancak path=" + cPath; DAİMA yürütülür, çünkü kaşlı ayraçları atladığınızda, JavaScript çalışma zamanına yalnızca sınamayı izleyen ilk ifadenin ya da kodun o şubeye girdiğinde else yürütülmesinin gerektiğini bildirirsiniz .

Bu, programınızda hatalara yol açacak olan bir SON KADAR KÖTÜ uygulamadır.

if (object.attachEvent){ 
     object.attachEvent("on" + evName, fnName); 
    } else if (object.addEventListener) { 
     object.addEventListener(evName, fnName, cap); 
    }

Ve: HER ZAMAN küme parantezleri ile şube kodunu çevreleyen

if (cPath) { 
     cString += "; 
     path=" + cPath; 
    }

Son olarak, çapraz tarayıcı olay kablolama fonksiyonu ile:

/* 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); 
}

Sen sadece içermemelidir Kıvırcık parantezler, ancak test sırasını değiştirerek performansı artırabilirsiniz. attachEvent sadece IE 8 ve altı için olduğundan, testinizin doğru olduğu nadir senaryo olacaktır, ancak her seferinde bunun için test ediyorsunuz. Sıralamayı değiştirirseniz, nadiren başka bir kodu çalıştırmanız gerekir, oysa şu anda test kodunu ve çoğu zaman kodu çalıştırmanız gerekir. Son olarak, else if değil, bir else'a ihtiyacınız vardır, çünkü olay modellerinden biri desteklenmiyorsa, diğeri ise - bunun için test etmeniz gerekmez.

function addEvent(object, evName, fnName, cap) { 
    if (object.addEventListener){ 
     object.addEventListener(evName, fnName, cap); 
    } else { 
     object.attachEvent("on" + evName, fnName); 
    }   
}

kaynak

2016-04-01 01:02:12

Seçilen Endeksi değeri özelliğini kullanarak seçilen Öğe alabilirsiniz. Bir çerez olarak saklamak

var cake = document.getElementById("favoriteCake"); 
var selectedCake = cake.options[cake.selectedIndex].value;

Tek yoludur:

document.cookie = "selected_cake="+selectedCake;

kaynak

2016-04-01 01:12:25

Tanımlama bilgileri (ve krem) Javascript kullanarak yazma

cevap

İlgili konular