JavaScript/Cookies help Hello, I am working with javascript for html5, and this
ID: 3821096 • Letter: J
Question
JavaScript/Cookies help
Hello, I am working with javascript for html5, and this assignment requires use of js and cookies. I've written out the JS and it works to an extent. The cookies are not stored on firefox and my results do not display, this is the JS File.
function survey() {
window.alert("Hello there! Thank you for taking our survey!");
var myResults = "";
if (window.confirm("Are you Ready?")) {
var myArray = new Array();
myArray[0] = prompt("What is your first name?");
myArray[1] = prompt("What is your last name?");
window.alert("Thank you " + myArray[0] + "For the next few questions, please hit Okay or Cancel");
myArray[2] = confirm(myArray[0] + ", Do you plan to sell any food items?");
myArray[3] = confirm(myArray[0] + ", Do you plan to sell any clothing items?");
myArray[4] = confirm(myArray[0] + ", Do you plan to sell any electronics?");
myArray[5] = confirm(myArray[0] + ", Do you plan to sell any home office supplies?");
myArray[6] = confirm(myArray[0] + ", Do you plan on selling any miscellaneous items?");
myArray[7] = confirm(myArray[0] + ", Do you plan on buying items?");
//cookie list
myCookieList =
"First Name=" + myArray[0] + ";"
+ "Last Name=" + myArray[1] + ";"
+ "Food items=" + myArray[2] + ";"
+ "Clothing=" + myArray[3] + ";"
+ "Electronics=" + myArray[4] + ";"
+ "Home Office Supplies=" + myArray[5] + ";"
+ "Miscellaneous=" + myArray[6] + ";"
+ "Buying?=" + myArray[7] + ";";
//splitting cookies
for (var i = 0; i < cookieListArray.length - 1; i++) {
name = cookieListArray[i].split('=')[0];
value = cookieListArray[i].split('=')[1];
myResults += name + ": " + value + "
";
var cookieEnabled = (navigator.cookieEnabled) ? true : false;
if (cookieEnabled == true) {
window.alert("You have cookies");
document.cookie = "favorite_toy=nerf";
document.cookie = (name + "=" + value);
}
else if (cookieEnabled == false) {
window.alert("Cookie not enabled");
}
}
document.getElementById("results").innerHTML = myResults;
}
else {
window.alert("I'm sorry. You can come back anytime to complete our survey.");
document.getElementById("results").innerHTML = myResults;
}
}
Nothing relating to cookies displays.
//////////////////////////html//////////////
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../images/week2-2favicon.ico">
<title>Jumbotron Template for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="../css/homework.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="../../assets/js/ie-emulation-modes-warning.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="../js/week5.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="../pages/week2-2.html">Project name</a>
<a class="navbar-brand" href="../pages/week2-1.html">Week2-1</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<form class="navbar-form navbar-right">
<div class="form-group">
<input type="text" placeholder="Email" id="txtUsername">
</div>
<div class="form-group">
<input type="password" placeholder="Password" id="txtPassword">
</div>
<button id="btnLogin">Log In</button>
</form>
</div><!--/.navbar-collapse -->
</div>
</nav>
<!-- Main jumbotron for a primary marketing message or call to action -->
<div class="jumbotron">
<div class="container">
<h1>Hello, class!</h1>
<article>
<p>
words
</p>
</article>
<p><a class="btn btn-primary btn-lg" href="https://www.csee.umbc.edu/~squire/blueball.htm" role="button">Learn more »</a></p>
</div>
</div>
<div class="container">
<!-- Example row of columns -->
<div class="row">
<div><a href="#"> Click here to take a survey</a></div>
<div id="results"></div>
</div>
<hr>
<footer>
<p>© 2016 Company, Inc.</p>
</footer>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"> </script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"></script>')</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
</body>
</html
/////////////////////////////////////////////////////css
body
{
padding-top: 50px;
padding-bottom: 20px;
}
.navbar{
background-color:red;
-webkit-animation-name:colorbar;
-webkit-animation-duration:3s;
-webkit-animation-iteration-count:infinite;
}
@keyframes colorbar{
25%{background-color:red;}
50%{background-color:pink;}
75%{background-color:red;}
100%{background-color:pink;}
}
div.jumbotron{
background-color:lightpink;
}
thead th{
text-align:left;
background:red;
color:white;
border:solid black;
}
tbody th{
text-align:center;
background:red;
border:solid black;
}
tbody td{
border: thin solid black;
font-weight:bold;
text-align:center;
}
td img{
width:100px;
height:100px;
}
label {
background-color:pink;
}
#fruit {
color: white;
border: medium solid black;
background-color: lawngreen;
padding: 4px;
font-size:x-large;
}
#fruit:hover{
font-size: xx-large;
border: medium solid white;
background-color: pink;
color:black;
padding:4px;
-webkit-transition-delay:100ms;
-webkit-transition-property:background-color, color, padding,font-size,border;
-webkit-transition-duration: 500ms;
}
@font-face{
font-family:'Acme';
font-style: normal;
font-weight: normal;
}
h1{
font-family: 'Acme', sans-serif;
text-shadow: 2px 2px green;
}
ul#fruitlist{
font-size:20px;
border: dashed black;
background-color:white;
-webkit-column-count:3;
-webkit-column-rule: 2px solid red;
}
ul img{
height: 100px;
width:100px;
}
div.row{
border:medium solid black;
background-color:grey;
box-shadow: 10px 10px black;
}
div h2{
color:red;
border: medium double black;
border-color:pink;
background-color:black;
text-shadow: 1px 1px white;
}
#durian::first-letter{
font-family:'Comic Sans MS';
color:seagreen;
font-size:xx-large;
}
#durian{
-webkit-column-count:3;
-webkit-column-rule:3px dotted black;
}
p img{
height:100px;
width:100px;
}
/* adjacent selector, the p part following h2 should turn yellow*/
h2 + p {
color: yellow;
}
.retailprice{
text-decoration: line-through;
color: red;
}
Explanation / Answer
(function(){ var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /_super/ : /.*/; // The base Class implementation (does nothing) this.Class = function(){}; // Create a new Class that inherits from this class Class.extend = function(prop) { var _super = this.prototype; // Instantiate a base class (but only create the instance, // don't run the init constructor) initializing = true; var prototype = new this(); initializing = false; // Copy the properties over onto the new prototype for (var name in prop) { // Check if we're overwriting an existing function prototype[name] = typeof prop[name] == "function" && typeof _super[name] == "function" && fnTest.test(prop[name]) ? (function(name, fn){ return function() { var tmp = this._super; // Add a new ._super() method that is the same method // but on the super-class this._super = _super[name]; // The method only need to be bound temporarily, so we // remove it when we're done executing var ret = fn.apply(this, arguments); this._super = tmp; return ret; }; })(name, prop[name]) : prop[name]; } // The dummy class constructor function Class() { // All construction is actually done in the init method if ( !initializing && this.init ) this.init.apply(this, arguments); } // Populate our constructed prototype object Class.prototype = prototype; // Enforce the constructor to be what we expect Class.prototype.constructor = Class; // And make this class extendable Class.extend = arguments.callee; return Class; }; })();
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.