JavaScript - Issue With Nested Loops And Closures
Hello everyone,
I have been working on this function but no luck so far. Basically this is a simple vertical navigation menu, and I am just trying to to show or hide the sub-menus (unordered lists) with onmouseover & onmouseout. I can do this very easily with just css or inline events, but I'm just trying to figure it out the way I already set it up. So I am looping through the ULs first, then I loop through the LIs. Furthermore I find the right LI elements by checking their class names, and if they exist I trigger the onmouseover & onmouseout events on them so the ULs will appear/disappear. The issue is that this works only for the last list item because I am guessing of a closure. So instead of getting each item individually at each event, instead it gives me the last list item. I have searched the web for a while now about closures and such, but all the examples I find talk about nested functions and a single loop, which isn't my case because I have two loops and only one function. Any help would be appreciated. HTML Code: Code: <div id="navWrapper"> <ul> <li class="triggers"><a href="#">Item 1</a> <ul class="subMenu"> <li><a href="#">Item 1.1</a></li> <li><a href="#">Item 1.2</a></li> <li><a href="#">Item 1.3</a></li> </ul> </li> <li class="triggers"><a href="#">Item 2</a> <ul class="subMenu"> <li><a href="#">Item 2.1</a></li> <li><a href="#">Item 2.2</a></li> <li><a href="#">Item 2.3</a></li> </ul> </li> <li class="triggers"><a href="#">Item 3</a> <ul class="subMenu"> <li><a href="#">Item 3.1</a></li> <li><a href="#">Item 3.2</a></li> <li><a href="#">Item 3.3</a></li> </ul> </li> </ul> </div> Javascript Code: Code: <script type="text/javascript"> function hoverSh () { var navWrap = document.getElementById('navWrapper'); var uls = navWrap.getElementsByTagName('ul'); var listItems = navWrap.getElementsByTagName('li'); for (var i=0; i<uls.length; i++) { if (uls[i].className == "subMenu") { var theUls = uls[i]; for (var j=0, c=listItems.length; j<c; j++) { if (listItems[j].className == "triggers") { var theItems = listItems[j]; theItems.onmouseover = function () {//alert(this.nodeName + i);return false; theUls.style.display = 'block'; } theItems.onmouseout = function () { theUls.style.display = 'none'; } }//end inner if }//end inner loop w/ j }//end if }//end outer loop w/ i } window.onload = hoverSh; </script> Any links pointing to simplified tutorials on closures would be helpful too. I thought I understood them but I guess not! Similar TutorialsOkay, I have another problem. I really can't figure out why it's not working in IE. The only problem I can think of would be using nested loops. Here's the part of the code that isn't working. It's not generating an error, it's just not returning anything. I know you guys hate when I post entire code, so I trimmed it down as much as I can. It's referring to an already stated xml document with xmlDoc. And it's goal is to return a table of rows that meet certain criteria. If you can see any syntax errors that explorer would not like, that's really what I'm asking for. Thanks in advance, Julian Code: var entries = Array.prototype.slice.call(arguments, 1); var headers = 0; for (var i=0;i<xmlDoc.getElementsByTagName('entry').length;i++) { var x = headers; headers += xmlDoc.getElementsByTagName('header').length; var id = xmlDoc.getElementsByTagName('entry')[i].getAttribute("id"); if (entries.indexOf(id) >= 0) { content += '<tr>'; for (x;x<headers;x++) { content += '<td>' + xmlDoc.getElementsByTagName('item')[x].firstChild.nodeValue + '<\/td>'; } } content += '<\/tr>'; } return content; Hey all, I am confused about the true difference between the two below examples. Code: first example: // Demonstrating a problem with closures and loops var myArray = [“Apple”, “Car”, “Tree”, “Castle”]; var closureArray = new Array(); // Loop through myArray and create a closure for each that outputs that item for (var i = 0; i < myArray.length; i++) { var theItem = myArray[i]; closureArray[i] = function() { document.write(theItem + “ < br / > ”); } } // Loop through the closures and execute each one. for (var i = 0; i < closureArray.length; i++) { closureArray[i](); } Here we iterate through the length of myArray, assigning the current index of myArray to theItem variable. We declare closureArray 4 times as an anonymous function. The anonymous function in turn declares the predefined write() function, which is passed parameters. Since write() is in closureArray() a closure is created??? During each iteration, theItem is reassigned its value. The four closures reference this value. Since they reference this same value and since this value is reassigned ultimately to the value of the fourth index position, tHe time we execute closureArray later on, all four closures output the same string. This is because all four closures are within the same scope "the same environment" and therefore are referencing the same local variable, which has changed. I have a couple of problems with this example: 1) I thought a closure is a function that is returned - the inner function is not returned above. 2) theItem is not even a local variable of the parent function (closureArray) - I thought in order for a closure to work, the inner function only accesses the local variables of the outer function, but in this case the local variable is defined OUTSIDE of the parent function. 3) The guy says the "the four closures are sharing the same environment." The thing is even in the second example, they are sharing the same environment. Second example: Code: // A correct use of closures within loops var myArray = [“Apple”, “Car”, “Tree”, “Castle”]; var closureArray = new Array(); function writeItem(word) { return function() { document.write(word + “ < br / > ”); } } // Loop through myArray and create a closure for each that outputs that item for (var i = 0; i < myArray.length; i++) { var theItem = myArray[i]; closureArray[i] = writeItem(theItem); } // Loop through the closures and execute each one. for (var i = 0; i < closureArray.length; i++) { closureArray[i](); } Here we iterate over the length of myArray (4 times), assigning the index of myArray to theItem variable. We also return a function reference to the closureArray during each iteration (closureArray[i]), where i is index number so we assign 4 functon references. So when we iterate through myArray, we immediatelly call the writeItem() fucntion passing an argument of theItem at its current value. This returns a child anonymous function and when that child function is called, it will execute a block that calls the predefined write() method. We assign that returned anonymous function to the variable closureArray. Hence, closureArray holds a reference to that anonymous function. So closureArray during each iteration holds a reference to the anonymous function and we later call closureArray, which in turn calls the anonymous function, therefore calling the predefined write() function to output the local variable of the parent function. This outputs each distinct index of myArray. QUESTION: This is because since we created the closure, when we call writeItem, passing theItem argument, since theItem is a local variable of the parent function of the closure, it is never destroyed when we later call closureArray (the reference to the child anonymous function)? Yet weren't we using a closure in the first example as well? So whey wasn't those variables preserved? I don't think it has anything to do with assigning a returned anonymous function to closureArray. Even though an anonymous function creates a new memory position in the javascript engine, therefore not overwriting the other function references we create during the iteration, it's still referring to a local variable declared outside the reference. So if it's about the closure retaining value of parent's local variable even after exiting the parent function allowing for the current indexes to be preserved, then why did the closure in the first example fail to retain each index? Thanks for response Recently I had an issue while trying to copy an array: I couldn't understand why modifying the new array caused modifications in the old array Old Pedant cleared that up nicely for me in http://www.codingforums.com/showthread.php?t=240020 Now I'm trying to understand closures, and scope and all that fun stuff thanks to Venegal's great tutorial at reallifejs.com and I have the following: Code: <script> window.USER = (function(){ var Employees = [['Alex',1,'ft',1],['Olivia',2,'ft',1],['Brenda',3,'ft',1],['Michael',4,'ft',1]]; var info = ['Start String']; var Setup = function(){ } return{ CheckLogin : function(login){ this.info = Employees[login]; }, Reset : function(){ }, info:info, Emp:Employees }; })(); </script> And I think I got all the kinks worked out, but there was one thing that I don't understand... Based on my other thread I expected the modification of USER.info to overwrite values in USER.Emp Don't get me wrong, I didn't want that to happen, I am just confused as to why it didn't I used the following buttons to test the values of USER.info and USER.Emp but again, writing to USER.info did not overwrite anything in USER.Emp.... Code: <script> document.write('<button onclick="alert(USER.info)">USER.info read</button>'); document.write('<button onclick="USER.info=\'Test String\'">USER.info write</button>'); document.write('<button onclick="alert(USER.Emp)">Employees read</button>'); document.write('<button onclick="USER.CheckLogin(0)">Check Login</button>'); </script> So what I guess I'm asking is why? Or maybe: what is happening here, and how does it differ from my last issue? Was it maybe a scope issue? Or maybe something more sinister...? Hey Guys, I'm currently a seasoned programmer who is in a programming class at my school. We're currently learning advanced JavaScript, and we're on the topic of nested loops. After teaching us about for and while loops, my teacher gave us a little puzzle to solve. It's kind of difficult to explain, but I'll give you guys my current code and what it outputs. Code: <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Word Reversal</title> <script type="text/javascript"> var ask = prompt("How many words do you want?",""); while (ask < "1") { alert("You have to have at least one word!"); var ask = prompt("How many words do you want?",""); } var num = parseInt(ask) + 1; var final = ""; for (var i=1; i < num; i++) { var word = prompt("What's word " + i + "?"); final = final + "Word " + i +": " + word + "<br/>"; } </script> </head> <body> <script type="text/javascript"> document.writeln(final); </script> </body> </html> The current output, when the user wants two words, and word 1 is one and word 2 is two, comes out to be: Code: Word 1: one Word 2: two Which is great, but the only problem is, this is what the output's supposed to be: Code: Word 2: two Word 1: one I'm stumped. I've had numerous programming challenges in my life which I've solved, but I'm not sure where to go next on this one. The script is supposed to use a nested loop, but what goes in what loop to reverse the order of the user's input? I asked my teacher for help, but he told me "Ask someone else." I asked another seasoned programmer in my class, who was just about as stumped as I was, so I went back to my teacher. "Well, ask another person" he replied. And can you believe this guy has a Master's Degree of Computer Science? So I'm asking you guys: the community. I hope someone will be able to help me. On top of that, I have to help and tutor two special education students in my class on this kind of stuff during class, and they can't get the project done until I get it done, as they learn from analyzing and copying my work (which my teacher told me to do). They get upset when they have nothing to code, and they end up goofing off the entire period, or using it as a study hall. I need to get them back on track, so we can move on to the next project. Please help me with this code - it would be greatly appreciated. Thank you! Hello codingforums.com! Right, this is probably going but such a stupid newbie thread but here goes.. I've finally got myself into gear to start learning javascript. I've been watching video tutorials, learning from websites and simply learning by error. I understand the concept of for loops, but the whole nested thing doesn't seem to click for some reason. I thought i understood and managed to write a piece of code that constantly writes '*' across the screen. Could someone with some pretty damn good knowledge of javascript be able to walk me through step by step of my script to explain what actually is happening? It would help loads. here is the script, many thanks!! <script type="text/javascript"> var counter = 0; function writeStars(){ for(i=0;i<1;i++){ for(a=0;a<=counter;a++){ document.write("*"); } counter++ document.write("<br />"); } } setInterval("writeStars()", 200); </script> I'm having trouble getting this nested loop to work. It only outputs the last image and I want it to loop through the images. Code: function loadgallery (){ var picarray= new Array () picarray[0]="pic1.jpg" picarray[1]="pic2.jpg" picarray[2]="pic3.jpg" picarray[3]="pic4.jpg" picarray[4]="pic5.jpg" picarray[5]="pic6.jpg" for (j=0;j<picarray.length ;j++ ){ pic=picarray[j] var tdarray = document.getElementsByTagName("td"); for (i=0;i<tdarray.length;i++ ){ tdarray[i].innerHTML='<select name="select1"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option></select><img src="pics/'+picarray[j]+'">'; } } } window.onload=loadgallery; i am having trouble with a program for class hoping someone can point me in the right direction i am supposed to use nested for loops to output 2 seperate webpages one with the first pattern below and then another with the second pattern. Thanks for your help [x] [x][x] [x][x][x] [x][x][x][x] [x][x][x][x][x] [x][x][x][x][x][x] [x][x][x][x][x][x][x] [x][x][x][x][x][x][x][x] [x][x][x][x][x][x][x][x][x] [x][x][x][x][x][x][x][x][x][x] [O] [O][O] [O][O][O] [O][O][O][O] [O][O][O][O][O] [O][O][O][O][O][O] [O][O][O][O][O][O][O] [O][O][O][O][O][O][O][O] [O][O][O][O][O][O][O][O][O] [O][O][O][O][O][O][O][O][O][O] ************************** ************************** [O][O][O][O][O][O][O][O][O][O] [O][O][O][O][O][O][O][O][O] [O][O][O][O][O][O][O][O] [O][O][O][O][O][O][O] [O][O][O][O][O][O] [O][O][O][O][O] [O][O][O][O] [O][O][O] [O][O] [O] Looks to me like this ought to work, but since I'm here obviously it doesn't. Regarding the HTML in question, there are divs and they do contain child elements. I'm trying to write this in as generic a fashion as possible, without using IDs or other means of targeting elements. And yes, the jQuery library is referenced/linked to the page. Any pointers much appreciated. Thank you <script type="text/javascript"> // <![CDATA[ var x=0; var h=1000; var Divs=document.getElementsByTagName("div"); function fades() { var i=0; var s=0; $("div").fadeOut(1000); while(x<Divs.length) { setInterval('fadeIns()',h); } } function fadeIns() { if(i<100) { Divs[x].childNodes[s].style.opacity=i/100; i++; } else if(s<Divs[x].childNodes.length) { clearInterval(h); s++; i =0; setInterval('fadeIns()',h); } else { clearInterval(h); x++; fades(); } } window.onload=fades; // ]]> </script> I am having an issue with this script I wrote. Actually it works the way it is now, but not the way I want it too. This is a random raffle ticket number generater. The guys at the fire department where talking about selling 300 tickets and discussing how they were going to select and call the numbers. It got me thinking and inspired to start messing around with javascript again. It all starts with index.html and a form w/ a button and textarea. When a user clicks the button it will generate a random number and insert it into the textarea. This is accomplished by the Generate(); function that is in Genny.js an external js file. Code: <h2>Raffle Ticket Number Generator</h2> <form name="theform"> <input type="button" name="pickNumber" value="Pick a Winner" onclick="Generate();" /> <br /><br /> <textarea cols="40" rows="25" name="winnersCircle">Winning Numbers Will Display Here! </textarea> </form> This much works just fine. Now onto Genny.js Code: //initialize counter and array count = 1; winners = new Array(); function Generate(){ //generate a random number from 0-300 var random_number = Math.floor(Math.random()*301); //checks output of Math.random() against winners array to see if number has been used already for (i = 0; i < winners.length; i++ ) { if ( winners[i] == random_number ) alert("I am so sorry... we have accidently drawn a duplicate number! Please pick again."); } //add the number to the array winners[count] = random_number; //increment the counter count++; //display the stored random number document.theform.winnersCircle.value = winners.join("\n"); } This much works...somewhat! It generates the random number and checks the winners array to see if it is already used. If it wasn't used it adds the number to the array, increments the counter, and then displays the number in the textarea of the form, as it should. If the number was used it alerts the user, once the user clicks the button to accept the alert it carries on with the script and adds it to the array again and also displays it. This is not what I want it to do. If the number was used I do not want it added to the array or displayed. I would also like it to regenerate another number without the alert. The alert was wrote in to assist me in checking to see if it was finding a duplicate number, thats all. As an extra, is there a way to also add a numbered list to the results. To show the sequence of the ticket draw. I have messed with this for days and rewrote it over and over. I have used different loops and conditional operators to try and solve this problem. But to no avail. Here I am, asking not for the answer but a push in the right direction. Any help would be great, this is becoming an obsession trying to make it work. The code above is the last attempt at this point. Everything else has returned no values or just errors. Thanks in advance! I'm having a javascript problem with nested elements. Consider an example in which you have two nested elements with element 2 being inside of element 1 and only element 1 has an onmouseout event handler. <div style="position:relative;border:1px solid red;width:300px;height:300px" onmouseout="alert('whatever')"> //element 1 <div style="position:absolute;border:1px solid blue;left:50%;top:50%;margin-left:-50px;margin-top:-50px;width:100px;height:100px">//element 2 </div> </div> The 2 problems here are as follows: 1- Moving the mouse pointer over element 2 from element 1 causes a onmouseout with element 1. But this is a minor problem. 2- Moving the mouse pointer from element 2 back to element 1 causes a mouseout with ,I believe, element 2 even though there is no onmouseout event handler here. This is a major problem. Is problem #2 due to possibly an automatic inheritance of the onmouseover handler from element 1 onto element 2 OR is it the result of event capturing or what else? I can't tell either way. If it's due to inheritance how do you stop this from taking place? The strange thing is that tutorials give this kind of scenario with element 2 inside of element 1 with both elements having the same event handler but they don't say what happens in this case with just one element having a specific event handler. Thank you. I tried a a few tutorials but still can't get it, can any simply closures please?
I get programming. Really, I do. But this closure thing has me lost and needing a nice, simple explanation. Here's the code from the dojo tutorial: <script type="text/javascript"> dojo.require("dijit.form.Button"); // this is just to make the demo look nicer var arrFruit = ["apples", "kiwis", "pineapples"]; function populateData() { dojo.forEach(arrFruit, function(item, i) { var li = dojo.doc.createElement("li"); li.innerHTML = i + 1 + ". " + item; dojo.byId("forEach-items").appendChild(li); }); } </script> It is the anonymous function(item, i) that is perplexing me. As I see it, this use is not CREATING a function. It is calling a function called "function." Clearly, I am not up-to-speed. I am confounded as to how, within function(), "item" is KNOWN to refer to the value of the array element, and "i" is KNOWN to refer to the current element in the dojo.forEach() function. In my mind, I see a call to function, trying to pass parameters to it which were never defined above. The way I see it is: function myfunction(item, i) {code here} myfunction(this, that); In this example, I would get an error because "this" and "that" are not defined. Help, please!!! Hey all, I am having issues with below script. Firebug returns: form[0] is undefined [Break on this error] $(form[0].elements).each(function() { I have this under my form: <script> var thisForm = $('#validateForm'); thisForm.validation(); </script> Code: (function($) { /* Validation Singleton */ var Validation = function() { var rules = { email : { check: function(value) { if(value) return testPattern(value,".+@.+\..+"); return true; }, msg : "Enter a valid e-mail address." }, url : { check : function(value) { if(value) return testPattern(value,"https?://(.+\.)+.{2,4}(/.*)?"); return true; }, msg : "Enter a valid URL." }, required : { check: function(value) { if(value) return true; else return false; }, msg : "This field is required." } } var testPattern = function(value, pattern) { var regExp = new RegExp("^"+pattern+"$",""); return regExp.test(value); } return { addRule : function(name, rule) { rules[name] = rule; }, getRule : function(name) { return rules[name]; } } } /* Form factory */ var Form = function(form) { var fields = []; $(form[0].elements).each(function() { var field = $(this); if(field.attr('validation') !== undefined) { fields.push(new Field(field)); } }); this.fields = fields; } Form.prototype = { validate : function() { for(field in this.fields) { this.fields[field].validate(); } }, isValid : function() { for(field in this.fields) { if(!this.fields[field].valid) { this.fields[field].field.focus(); return false; } } return true; } } /* Field factory */ var Field = function(field) { this.field = field; this.valid = false; this.attach("change"); } Field.prototype = { attach : function(event) { var obj = this; if(event == "change") { obj.field.bind("change",function() { return obj.validate(); }); } if(event == "keyup") { obj.field.bind("keyup",function(e) { return obj.validate(); }); } }, validate : function() { var obj = this, field = obj.field, errorClass = "errorlist", errorlist = $(document.createElement("ul")).addClass(errorClass), types = field.attr("validation").split(" "), container = field.parent(), errors = []; field.next(".errorlist").remove(); for (var type in types) { var rule = $.Validation.getRule(types[type]); if(!rule.check(field.val())) { container.addClass("error"); errors.push(rule.msg); } } if(errors.length) { obj.field.unbind("keyup") obj.attach("keyup"); field.after(errorlist.empty()); for(error in errors) { errorlist.append("<li>"+ errors[error] +"</li>"); } obj.valid = false; } else { errorlist.remove(); container.removeClass("error"); obj.valid = true; } } } /* Validation extends jQuery prototype */ $.extend($.fn, { validation : function() { var validator = new Form($(this)); $.data($(this)[0], 'validator', validator); $(this).bind("submit", function(e) { validator.validate(); if(!validator.isValid()) { e.preventDefault(); } }); }, validate : function() { var validator = $.data($(this)[0], 'validator'); validator.validate(); return validator.isValid(); } }); $.Validation = new Validation(); })(jQuery); Hey Guys! I've previously done HTML, but now started to learn some aspects of Javascript but getting rather confused with Loops! I've done a some coding for the Loop question (probably doesn't make sense) but I was wondering if you could help me out? I'm about as confused as a cow on a Astro Turf so my code may look terrible! - For this question you will: Draw a flow chart and write a javascript function which will use a for loop and allow the user to enter the details for four students when the program is run and display the average. Assume that they equal weighting. Hint: Javascript may assume that the value received from a prompt is a string so use parseInt() to make sure the number is an integer. Here is my code: (I'm using Aptana) Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <meta http-equiv="Content-Type" content="text/javascript; charset=utf-8"/> <title>Average Marks</title> <!-- Date: 2011-10-27 --> <head> <script type="text/javascript"> function marks () { var mark1 = 10; var mark2 = 25; var mark3 = 50; for(var mark1 = 10; mark1<20; mark1++) (var mark2 = 25; mark2<50; mark2++) (var mark3 = 50; mark3<90; mark3++) { alert(mark1 + "<br /> "); (mark2 + "<br /> "); (mark3 + "<br />" ); console.log(mark1) console.log(mark2) console.log(mark3) } } function average () { parseInt() } </script> <body onload="marks()"> </body> </head> </html> P.S. I'm not using the prompt for the user to enter their details yet, as I wanted to test it with the marks already set. Regards Hello, i am new here however my knowledge is not that limited like that one guy wolf who oldMaster was helping with i read the RULES and his thread lol so my question is, i have made a for loop and in side the for loop i wrote document.write(<td>date</td>"<td class = 'amt'>amount</td>); where date, amount, firstName, and lastName, are the values of the date, amount, firstName, and lastName arrays for the index indicated by the current value of the for loop counter varible so questions : i have spent the past 3 days looking online for the correct answer document.write(<td>date</td>"<td class = 'amt'>amount</td>); ? HTML FILE Code: <title>The Lighthouse</title> <link href="lhouse.css" rel="stylesheet" type="text/css" /> <script type = "text/javascript" src = "list.js"></script> <!-- caling the external file --> <script type ="text/javascript"> function amountTotal(){ //i dont think we need an array made because we have called the external file called list.js which holds the arrays //sets the variable to 0 var total = 0; //new Array("firstName", "lastName", "street", "city", "state", "zip", "amount", "date"); //that loops through all the values in the amount array, at each point in the loop add the current value of the array item to the value of the total variable for(var i = 0; i < amount.length; i++) { total = total + amount[i]; }//enf forloop //i must return the sum of all the values in the amount array return total; }//end of function total </script> </head> <body> <div id="title"> <img src="logo.jpg" alt="The Lighthouse" /> The Lighthouse<br /> 543 Oak Street<br /> Owensboro, KY 42302<br/> (270) 555-7511 </div> <div id="data_list"> <!--//creates a new script --> <script type = "text/javascript"> document.write("<table border='1' rules='rows' cellspacing='0'>"); document.write("<tr>"); document.write("<th>Date</th><th>Amount</th><th>First Name</th>"); document.write("<th>Last Name</th><th>Address</th>"); document.write("</tr>"); document.write("</table>"); for(var i = 0; i < date.length; i++) { if(i % 2 ) document.write("<tr>"); else document.write("<tr class='yellowrow'>"); document.write("<td>"date"</td>"<td class = 'amt'>amount"</td>"); }//end for </script> </div> <div id="totals"> <!--//this creates a script --> <script type = "text/javascript"> //this is how to print a table to the screen only when html is inside a script document.write( <table border='1' cellspacing='1'> <tr> <th id ='sumTitle' colspan='2'> Summary </th> </tr> <tr> <th>Contributors</th> <th>contributions</th> </tr> <tr> <th>Amount</th> <td>$total</td> </tr> </table>); </script> </div> </body> </html> THIS IS THE ARRAY LIST WHICH IS THE EXTERNAL FILE Code: firstName = new Array(); lastName = new Array(); street = new Array(); city = new Array(); state= new Array(); zip = new Array(); amount = new Array(); date = new Array() firstName[0]="Nina"; lastName[0]="Largent"; street[0]="88 Regal Lane"; city[0]="Williamsburg"; state[0]="KY"; zip[0]="40769"; amount[0]=125; date[0]="2011-09-18"; firstName[1]="Mike"; lastName[1]="Hunt"; street[1]="Da404 Barrow Street"; city[1]="London"; state[1]="KY"; zip[1]="40742"; amount[1]=75; date[1]="2011-09-18"; firstName[2]="Monica"; lastName[2]="Lang"; street[2]="743 Stawlings Drive"; city[2]="Danville"; state[2]="KY"; zip[2]="40423"; amount[2]=50; date[2]="2011-09-16"; firstName[3]="William"; lastName[3]="Mcknight"; street[3]="102 Maple Lane"; city[3]="Danville"; state[3]="KY"; zip[3]="40423"; amount[3]=150; date[3]="2011-09-15"; firstName[4]="Latrina"; lastName[4]="Hults"; street[4]="750 Whitehall Road"; city[4]="London"; state[4]="KY"; zip[4]="40742"; amount[4]=250; date[4]="2011-09-14"; firstName[5]="Danny"; lastName[5]="Shamblin"; street[5]="123 Smith Drive"; city[5]="Owensboro"; state[5]="KY"; zip[5]="42303"; amount[5]=50; date[5]="2011-09-13"; firstName[6]="Tina"; lastName[6]="Ammons"; street[6]="888 Evans Way"; city[6]="Williamsburg"; state[6]="KY"; zip[6]="40769"; amount[6]=50; date[6]="2011-09-13"; firstName[7]="Joanne"; lastName[7]="Fine"; street[7]="210 Bowling Terrace"; city[7]="Williamsburg"; state[7]="KY"; zip[7]="40769"; amount[7]=125; date[7]="2011-09-11"; firstName[8]="Charlotte"; lastName[8]="Foulk"; street[8]="109 South Road"; city[8]="Danville"; state[8]="KY"; zip[8]="40423"; amount[8]=50; date[8]="2011-09-10"; firstName[9]="Candice"; lastName[9]="Alfaro"; street[9]="108 Atwood Avenue"; city[9]="Owensboro"; state[9]="KY"; zip[9]="42303"; amount[9]=400; date[9]="2011-09-08"; firstName[10]="Kristi"; lastName[10]="Laine"; street[10]="512 North Lane"; city[10]="Williamsburg"; state[10]="KY"; zip[10]="40769"; amount[10]=225; date[10]="2011-09-08"; firstName[11]="Elisabeth"; lastName[11]="Carbone"; street[11]="381 Main Street"; city[11]="London"; state[11]="KY"; zip[11]="40742"; amount[11]=200; date[11]="2011-09-07"; firstName[12]="James"; lastName[12]="Larsen"; street[12]="212 Rawlings Way"; city[12]="Jackson"; state[12]="KY"; zip[12]="41339"; amount[12]=125; date[12]="2011-09-07"; firstName[13]="Ralph"; lastName[13]="Thornton"; street[13]="444 Smith Drive"; city[13]="Owensboro"; state[13]="KY"; zip[13]="42303"; amount[13]=100; date[13]="2011-09-07"; firstName[14]="Robin"; lastName[14]="Witt"; street[14]="78 Norland Pines"; city[14]="London"; state[14]="KY"; zip[14]="40742"; amount[14]=75; date[14]="2011-09-07"; firstName[15]="Alex"; lastName[15]="Ruiz"; street[15]="102 Sunset Road"; city[15]="Jackson"; state[15]="KY"; zip[15]="41339"; amount[15]=50; date[15]="2011-09-06"; firstName[16]="Callie"; lastName[16]="Rudy"; street[16]="3 Sunset Road"; city[16]="Jackson"; state[16]="KY"; zip[16]="41339"; amount[16]=50; date[16]="2011-09-06"; firstName[17]="Michael"; lastName[17]="Harrell"; street[17]="125 Sunset Road"; city[17]="Jackson"; state[17]="KY"; zip[17]="41339"; amount[17]=50; date[17]="2011-09-06"; firstName[18]="Edgar"; lastName[18]="Morales"; street[18]="387 North Lane"; city[18]="Williamsburg"; state[18]="KY"; zip[18]="40769"; amount[18]=250; date[18]="2011-09-05"; firstName[19]="Arlene"; lastName[19]="Lutz"; street[19]="7888 Clear View Drive"; city[19]="Danville"; state[19]="KY"; zip[19]="40423"; amount[19]=75; date[19]="2011-09-05"; firstName[20]="Earl"; lastName[20]="Holmes"; street[20]="1001 Rawlings Way"; city[20]="Jackson"; state[20]="KY"; zip[20]="41339"; amount[20]=500; date[20]="2011-09-04"; firstName[21]="Bernice"; lastName[21]="Drew"; street[21]="25 Main Street"; city[21]="London"; state[21]="KY"; zip[21]="40742"; amount[21]=150; date[21]="2011-09-04"; firstName[22]="Patrick"; lastName[22]="Granier"; street[22]="100 Atwood Avenue"; city[22]="Owensboro"; state[22]="KY"; zip[22]="42303"; amount[22]=75; date[22]="2011-09-03"; firstName[23]="Henry"; lastName[23]="Bailey"; street[23]="37 East Maple Street"; city[23]="Danville"; state[23]="KY"; zip[23]="40423"; amount[23]=50; date[23]="2011-09-03"; firstName[24]="Ginny"; lastName[24]="Rainey"; street[24]="657 Dawson Lane"; city[24]="Danville"; state[24]="KY"; zip[24]="40423"; amount[24]=50; date[24]="2011-09-03"; firstName[25]="Ginny"; lastName[25]="Rainey"; street[25]="657 Dawson Lane"; city[25]="Danville"; state[25]="KY"; zip[25]="40423"; amount[25]=75; date[25]="2011-09-03"; firstName[26]="Basilia"; lastName[26]="Lu"; street[26]="851 Flad Court"; city[26]="Jackson"; state[26]="KY"; zip[26]="41339"; amount[26]=500; date[26]="2011-09-02"; firstName[27]="Livia"; lastName[27]="Mckinnon"; street[27]="557 Ivy Avenue"; city[27]="Jackson"; state[27]="KY"; zip[27]="41339"; amount[27]=50; date[27]="2011-08-31"; firstName[28]="Kris"; lastName[28]="Levesque"; street[28]="542 Upton Avenue"; city[28]="Owensboro"; state[28]="KY"; zip[28]="42303"; amount[28]=100; date[28]="2011-08-31"; firstName[29]="Lynwood"; lastName[29]="Ingersoll"; street[29]="723 Jackson Avenue"; city[29]="Owensboro"; state[29]="KY"; zip[29]="42303"; amount[29]=500; date[29]="2011-08-30"; firstName[30]="Petronila"; lastName[30]="Damico"; street[30]="44 Stewart Street"; city[30]="London"; state[30]="KY"; zip[30]="40742"; amount[30]=250; date[30]="2011-08-30"; firstName[31]="Hugh"; lastName[31]="Warren"; street[31]="585 Lindon Court"; city[31]="Williamsburg"; state[31]="KY"; zip[31]="40769"; amount[31]=50; date[31]="2011-08-28"; firstName[32]="Tom"; lastName[32]="Thomas"; street[32]="Rigel Avenue"; city[32]="London"; state[32]="KY"; zip[32]="40742"; amount[32]=100; date[32]="2011-08-27"; firstName[33]="Steve"; lastName[33]="Bones"; street[33]="900 Lawton Street"; city[33]="Williamsburg"; state[33]="KY"; zip[33]="40769"; amount[33]=50; date[33]="2011-08-25"; firstName[34]="Jeri"; lastName[34]="White"; street[34]="Hawkes Lane"; city[34]="Owensboro"; state[34]="KY"; zip[34]="42303"; amount[34]=150; date[34]="2011-08-25"; Hey everyone! I am pretty new to JS and I am having a problem figuring this loops structure out - any help would be appreciated. I am trying to add a password to an html page via an external JS file. (I know this isn't an ideal solution for securing a page - I am just trying to use this for trying to understand loops.) What I am trying to do is prompt the user to enter a password before the html page loads. If the password is correct they can enter the page. If they guess wrong the user is looped back to a prompt box to try again. If they fail 3 times they should be told via an alert box and sent off somewhere else. I have tried using a for & do while loop and was unsuccessful. I think this is the best way to go. This is what I have so far: Code: var password = prompt('All women a ',' '); var pass1 = "Psycho"; var counter = 0; if (counter < 3) { if (password = pass1) { alert('Password Correct! Click OK to enter!'); counter++ } else { alert("Password Incorrect!!!"); window.location="Lab5Part2.html"; } } else { alert("You have failed 3 times!"); window.location="http://www.google.com"; } Hi everyone. I have a loop question. This is my assignment for my Comp Apps class. The whole thing is a store selling guitar picks. What I'm missing now is a loop. After the costumer places the order, he has the choice to go back and buy more or complete the order. In the end all the order the costumer placed adds up to the total. This is what I have so far: PHP Code: <script type="text/javascript"> var name = prompt("Welcome to Pick Center. Please enter your name", " "); alert("Hello " + name + "! Please look through our list of picks before placing your order."); var product = prompt("What would you like to buy?", ""); var quantity = prompt("How many " + product + " would you like to order?", ""); var confirming = confirm(""+ name + " you ordered " + quantity +" " + product +" picks. Is this correct?"); var price = " "; var item_discount = " "; if ( confirming == true ) { } else { alert("Refresh the page to reload and place a new order.")} if ( product == "dirtbag" ) { price = "5"; item_discount = "0.3";} else if ( product == "delrin" ) { price = "7"; item_discount = "0.2";} else if ( product == "speedpick" ) { price = "10"; item_discount = "0.5";} else if ( product == "stubby") { price = "25"; item_discount = "0.25";} else { alert("Sorry," + name + ". You entered an invalid product. Refresh the page to reload and place the order again.");} var cost_of_order = price * quantity; var discount = price * item_discount * quantity; var total = cost_of_order - discount; document.write("<br><h1> Your Order: </h1></br><br>"); document.write("Thank you for placing an order with us, <b>" + name + "</b>.<br><br>"); document.write("The cost of buying " + quantity + " " + product + " picks is <b>$" + cost_of_order + "</b>.<br><br>"); document.write("The discount for this purchase is <b>$" + discount + "</b>.<br><br>"); document.write("With discount, your total order cost is <b>$" + total + "</b>.<br><br>"); </script> I've tried reading around and I bought a couple of books but I just can't get a grasp on loops. Can someone please help me with this? I am working on making 2 for loops of 2 arrays to get the total of them. Then I need to get the average heights. This is for a test, yet I have not got a clue, so I need clues as I cant get it to work and I am a new coder to javascript. Code: var heights = [15,16,17,18,19]; var numbers = [2,1,6,4,2]; var average = new Array(5); average = 0 for (var heights = 0; heights <= 5; heights = heights+ 1) { total = 0 } for (var numbers = 0; numbers <= 5; numbers = numbers + 1) { total = 0 average = heights / numbers; } document.write('The average height is ' + average); Am I on the right road? I need to use this format and not functions. I have got 2 for statements but maybe I could do this with one, it is so tricky this javascript. Hello all. I've spent a few days now browsing this forum along with guides on the net, I'm new to JS and I'm having a bit of trouble with loops. I just don't seem to get them, I was wondering if anyone had any tips or methods (the simpler the better ) for getting these learnt and done with? Would appreciate any tips Thanks |