JavaScript - For Loop That Calls A Function 5 Times Calls 5 Functions **simultaneously**?
I am trying to display some images in, say, 500ms intervals, but I want to loop through images, so I use a for loop and setTimeouts and function calls...
Code: for (i=0;i<=5;i++) { setTimeout(DisplayTheImage, 500); } (a var that increments the image like image[x] is somewhere else) but I think all I accomplish is that while the above code calls the function 5 times alright, all five function calls occur simultaneously. Right? Eh, I want the function to be called 5 times, but at five different times, namely in 500ms intervals. I thought the function would wait to finish (500 ms) then another call and so on. How can I do that? Similar TutorialsThis is the first function. Code: <html> <head> </head> <body> <script language="javascript" type="text/javascript"> function getthat****(){ num_a=Number(document.addition.entry_1.value); num_b=Number(document.addition.entry_2.value); num_c=Number(document.addition.entry_3.value); num_d=Number(document.addition.entry_4.value); num_e=Number(document.addition.entry_5.value); valNum1=num_a*num_c valNum2=num_a*num_d valNum3=num_b*num_c valNum4=num_b*num_d valNum5=valNum1-valNum4 valNum6=valNum2+valNum3 valNum7=num_e/Math.sqrt(3) valNum8=valNum7+valNum1-valNum4 document.addition.endVal1.value=valNum8; document.addition.endVal2.value=valNum6; } </script> <form name="addition"> <br> impedance (rectangular) <input type="text" name="entry_1"> + j <input type="text" name="entry_2"> ohms <br> <br> line current (rectangular) <input type="text" name="entry_3"> + j <input type="text" name="entry_4"> amperes<br><br> <br> <br> line value of receiving voltage <input type="text" name="entry_5"> volts (angle is zero degrees) (reference) <br> <br> (<input type="text" name="endVal1"> + j <input type="text" name="endVal2">) Volts <br> <input type="button" value="Product" onclick="getthat****()"> <input type="reset" value="Clear"> </form> </body> </html> And this is the second one. Code: <html> <head> </head> <body> <script language="javascript" type="text/javascript"> function PolarConvert(){ num_1=Number(document.addition.entry_1.value); num_2=Number(document.addition.entry_2.value); valNum1=Math.pow(num_1,2); valNum2=Math.pow(num_2,2); valNum3=Math.sqrt(valNum1 + valNum2); valNum4=Math.atan(num_2/num_1); valNum5=(valNum4*180)/Math.PI; document.addition.endVal.value=valNum3; document.addition.endVal2.value=valNum5; } </script> <form name="addition"> <input type="text" name="entry_1">+ j <input type="text" name="entry_2"> = <input type="text" name="endVal"> angle <input type="text" name="endVal2"><br> <input type="button" value="Convert to polar" onclick="PolarConvert()"> <input type="reset" value="Clear"> </form> </body> </html> The question is how do I combine these given that the value that would be computed in function 2 is already computed in function 1 ? Thanks a lot !!! Is it possible to capture function calls? for example: alert('hello world'); is there a way to capture this function call. Why do i want to do this: 1. i need a way to test if a function exist before it is called, so i dont get undefined errors etc. 2. try/catch only works on sections of code, i need a global solutions.(can i capture functions calls on remotely loaded scripts, like google analytics etc ) I want to have a button in a form that only calls a Javascript function, but not refresh the page, how do I do this?
Hi, I have a search function which works when I only want to have only one search per page, but as it involves a string call I'm not sure how to modify it to multiple search requests on a page. The below works fine for one call: Code: <script type="text/javascript"> function showHint(str){ if (str.length==0){ document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getName.php?q="+str,true); xmlhttp.send(); } </script> </head> <body> <label>Search by name: </label> <input type="text" id="txt1" class="input" onkeyup="showHint(this.value)" /> <br /> <p>Suggestions: <span id="txtHint"></span></p> <br /> But if I want to do mulitple I have tried changing it to: Code: <script type="text/javascript"> function showHint(File,ID){ if (str.length==0){ document.getElementById(ID).innerHTML=""; return; } if (window.XMLHttpRequest){ xmlhttp=new XMLHttpRequest(); } else{ xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET",File,true); xmlhttp.send(); } </script> </head> <body> <label>Search by firstname: </label> <input type="text" id="txt1" class="input" onkeyup="showHint('GetFirstName.php?q='+str,'txtHint')" /> <br /> <p>Suggestions: <span id="txtHint"></span></p> <br /> <label>Search by surname: </label> <input type="text" id="txt1" class="input" onkeyup="showHint('getLastName.php?q='+str,'txtHintSn')" /> <br /> <p>Suggestions: <span id="txtHintSn"></span></p> <br /> The above doesn't work and I am not sure what do about the showHint(str) as clearly I am not representing it properly in my attempt to modify the script. Hi, I've been playing around trying to recreate the way in which jQuery chains it's functions for it's "select" then "do" behaviour. Note: I don't want to chain functions with jQuery, I want to chain them like jQuery. So based on the jQuery code what I have so far is (doesn't work in IE): Code: var x = function(string) { return new x.fn.init(string); }; x.fn = x.prototype = { message: '', init: function(string) { x.fn.message = string; }, log: function() { console.log(x.fn.message); } }; x.fn.init.prototype = x.fn; var start = function() { x('hello world').log(); }; document.addEventListener('DOMContentLoaded', start, false); The code works but when I watch '$' in jQuery "fn" & "prototype" show up as being "jQuery()" but in my code when I watch "x": "fn" and "prototype" are both shown as objects containing "message", "init" and "log" and in both cases "init" contains "prototype" which contains my three functions again and the nesting continues seemingly infinitely... I'm clearly missing something here. What are they doing in differently in jQuery to prevent this endless nesting loop? I have the following javascript function: [ function addNewWindowEvent(evType, fn) { if (window.addEventListener) { this.addEventListener("load", fn, false); return true; } else if (window.attachEvent) { var onload = "onload" this.attachEvent(onload, fn); return true; } else { return false; } } ] which is giving me a an exception every time a page on our site loads. The actual exception in firefox is this: uncaught exception: [Exception... "Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: https://cms-dev.stchas.edu/global/js/hdvscripts.js :: addNewWindowEvent :: line 5" data: no] and I'm not sure exactly what it's complaining about. I'm relatively new to javascript so diagnosing and fixing this problem has me quite puzzled, and so far I have been unable to find anything helpful when I try and google for information on this. I would appreciate any help or suggestions. Thanks. henryv Code: <html> <body> var j=0; var temp,temp2,temp3; <script> function scor(j) { switch(j) { case 1: alert("Απαντήσατε σωστά μόνο σε μία ερώτηση.Προσπαθήστε πάλι"); break; case 2: alert("Απαντήσατε σωστά στις δύο από τις τρείς ερωτήσεις"); break; default: alert ("Συγχαρητήρια απαντήσατε σωστά και στις τρεις ερωτήσεις"); } } </script> <meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7"> <p align="center"><font size="5">Σε μία σελίδα html πόσα είναι τα μέγιστα frames που μπορούμε να τοποθετήσουμε; </p></font> <form name="for1"> <input type="radio" name="fr1"value="1" > 5 <br> <input type="radio" name="fr1"value="2" > Όσα τα pixels<br> <input type="radio" name="fr1"value="3" > Δεν υπάρχει όριο<br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal1()"> </form> <script type = "text/javascript"> function getVal1() { for(var i=0; i<document.for1.fr1.length; i++) { if (document.for1.fr1[i].checked) { if (document.for1.fr1[i].value==2) { j++; } } } } function getVal2() { for (var i=0;i<document.for2.fr2.length;i++) { if (document.for2.fr2[i].checked) { if (document.for2.fr2[i].value==2) { j++; } } } } function getVal3() { for (var i=0;i<document.for3.fr3.length;i++) { if (document.for3.fr3[i].checked) { if (document.for3.fr3[i].value==3) { j++; } } } } </script> <p align="center"><font size="5"> Είναι απαραίτητο σε κάθε σελίδα html να υπάρχουν τα tags head και title;</p></font> <form name="for2"> <input type="radio" name="fr2" value="1"> Ναι <br> <input type="radio" name="fr2" value="2"> Όχι <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal2()"> </form> <p align="center"><font size="5"> Τι κάνει το εξής tag: meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7" </p></font> <form name="for3"> <input type ="radio" name="fr3" value="1"> Δημιουργεί τις προυποθέσεις για την απόκτηση τιμών <br> <input type ="radio" name="fr3" value="2"> Ισσοροπεί τις παραγράφους σε στήλες <br> <input type ="radio" name="fr3" value="3"> Επιτρέπει την κωδικοποίηση ελληνικών χαρακτήρων στην ιστοσελίδα <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal3()" </form> <input type ="button" value="Υπολογισμός" onClick="scor(j)"> Apart from any logical mistakes this thing i have created might have , my question is this.Why upon pressing the last button and calling the "scor(j)" function , no alerts pop up?Thanks in advance. I'm completely stumbled by this as i have no clue as what might be wrong.But then again , my experience is extremely limited here is my issue... i have an object and i need to call two functions. i need the onclick="something" to call a server side function and then i need another onclick="something" to call a javascript funtion... the problem is you can only have one "onclick" (similar to having one "class")... how can I set up an onclick that will call both my serverside function and my javascript function... I realize this is not specifically serverside section of forum, so pretend I am asking how to call two separate javascript functions with different names the item in question is here Code: <asp:Button ID="btn_gen1" runat="server" Text="InterventionCentral" class="show" onclick="btn_gen1_Click" onclick="autohide" onmouseover="details_visible(1)" onmouseout="details_hidden(1)" /> just showing this to clarify that javascript does work with the asp and my mouse functions are working fine... my asp onclick works as well.. i can remove the asp and leave the js and it will work, but then all the stuff i do server side for the onclick goes away is this able to be done? this is for dev testing and i will eventually run into the same problem of needing to call two separate javascipt functions via onmouseover and also onmouseout ** sorry for posting this here. Kinda rushed on time, hoping for some clues. Hello, I am using this code: using prototype too. Code: Code: var haveData = false; [xmllink1, xmllink2, xmllink3].each(function(xmlURL){ if(haveData == false){ new Ajax.Request( xmlURL, { method: 'get', contentType: "application/xml", onSuccess: function( transport ) { var titles = transport.responseXML.getElementsByTagName( 'titles' ); DO SOME WORK HERE haveData = true; throw $break; } }, onFailu function() { return; }, onException: function(request,error) { return; } } What I am trying to do is if my first item "xmllink1" has some data, we break out and end it and now we can 'build some structures' ie.. onSuccess If xmllink1 doesn't have any valid data, we go to xmllink2 etc.. and so forth. Basically, when I get some valid returns.. I want to then exit out of the loop and then act on my data. But I need it in order so I know that my xmllink1 is not being in a race conditiona with xmllink2 etc.. But what is happening is I have simulataneous things going on and I get an onException (because one of the links doesn't resolve or has bad data) and that ends up killing my javascript. How can I test in order.. if link1 is good, great.. exit the "each method" and act on that data.. if xmllink1 is bad (onfairlure or onexception) lets go to xmllink2 etc.... any ideas? Below I have a facebook login/logout script for my website. The login works fine. The AJAX requests the php file, waits for the "Success" response, and then reloads the page. The logout doesn't. Instead the browser goes to the PHP file with just the word "Success" printed on it. I've separated the xml request as a separate function but that doesn't appear to solve it either. Code: <script type="text/javascript"> //Ajax XML Loaders var xmlhttp; function loadXMLDoc(url,cfunc) { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=cfunc; xmlhttp.open("GET",url,true); xmlhttp.send(); } window.fbAsyncInit = function() { FB.init({appId: '215993265079207', status: true, cookie: true, xfbml: true}); /* All the events registered */ FB.Event.subscribe('auth.login', function(response) { // do something with response login(); }); FB.Event.subscribe('auth.logout', function(response) { // do something with response logout(); }); FB.getLoginStatus(function(response) { if (response.session) { // logged in and connected user, someone you know } }); }; (function() { var e = document.createElement('script'); e.type = 'text/javascript'; e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; e.async = true; document.getElementById('fb-root').appendChild(e); }()); function fbloginClick(){ FB.login(function(response) { if (response.session) { if (response.perms) { // user is logged in and granted some permissions. // perms is a comma separated list of granted permissions } else { // user is logged in, but did not grant any permissions } } else { // user is not logged in } }, {perms:'email,user_birthday'} ); } function login(){ //Fire the PHP Facebook Auth Script loadXMLDoc('facebook_auth.php',function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { if (xmlhttp.responseText == "Success"){ window.location = "template.php"; }else{ window.location = "login_failed.php"; } } }); } function fblogoutClick(){ FB.logout(function(response) { }); } function logout(){ //Fire the PHP Logout Script loadXMLDoc('logout.php',function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { if (xmlhttp.responseText == "Success"){ window.location = "template.php"; }else{ window.location = "login_failed.php"; } } }); } </script> Hi all, I would like to have an HTML button which, when clicked by the user, contacts the server and runs a Python script on the server. When the Python script finishes running, the current HTML page automatically reloads a file from the server. Is that possible? YJ I'm trying to create a script that has a countdown and at each second, a div is created on the page with some content. How to run both functions at the same time at the click of a button? Thanks to the answer!
Beginner JavaScripter here. I'm wanting to run a piece of code (add rows) a specified amount of times based upon the number selected. Also, rows can be added after initial number has been specified. Example: User1 selects 2 -> 2 rows are added User1 goes back and selects 3 -> 1 row is added, making 3 rows total I've tried the following, but it seems to not take into account the number of rows already added. Any help is appreciated. Code: if (numSelected > 0) { var counter = 0; while (rowsAdded < numSelected ) { function.addRow(); counter++; } } First off I didn't know whether to post this here or in the PHP section since it deals with both, but mostly JS. I have a PHP scraper that scrapes the job title, company name and location from a website and stores them in separate arrays. These values are then extracted out one at a time from the array and stored into a string, that is then passed to a Google Maps API. I can make this successfully happen once, the thing is I need to do it multiple times. I have an idea on what I should do but don't really know how to implement it (correctly). The idea I had was to create a function in the JavaScript section that accepts three values from PHP. This function would be called in my PHP for loop that extracts the values from the array into a string. The thing that confuses me is that the Map function is called via <body onLoad="initialize()">. Here's the link to my code I am working on a site and in the process borrowed some js from some one to get dropdown menus to work, but after a while got reports from people who tested my site of some problems and decided to verify all my code, and i have fixed most bugs but the one listed in the title. Code: sfHover = function() { var sfEls = document.getElementById("nav").getElementsByTagName("LI"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" sfhover"; }; sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" sfhover\\b"), ""); }; } }; if (window.attachEvent) {window.attachEvent("onload", sfHover);} and i am verifying it on jslint the error i get is: Quote: Error: Problem at line 6 character 10: Don't make functions within a loop. }; Problem at line 9 character 10: Don't make functions within a loop. }; Implied global: sfHover 1,12, document 2, window 12 any help will be appreciated, and I'm sure this isn't complex but i don't know much js and want to keep it the same. Ok, I'm nearly pulling my hair out with this one. I have been looking at this code for two evenings now, and rewrote it 4 times already. It started out as jQuery code and now it's just concatenating strings together. What I'm trying to do: Build a menu/outline using unordered lists from a multidimensional array. What is happening: Inside the buildMenuHTML function, if I call buildMenuHTML, the for loop only happens once (i.e. only for 'i' having a value of '0'.) If I comment out the call to itself, it goes through the for loop all 3 times, but obviously the submenus are not created. Here is the test object: Code: test = [ { "name" : "Menu 1", "url" : "menu1.html", "submenu" : [ { "name" : "menu 1 subitem 1", "url" : "menu1subitem1.html" }, { "name" : "menu 1 subitem 2", "url" : "menu1subitem2.html" } ] }, { "name" : "Menu 2", "url" : "menu2.html", "submenu" : [ { "name" : "menu 2subitem 1", "url" : "menu2subitem1.html" }, { "name" : "menu 2subitem 1", "url" : "menu2subitem1.html" } ] }, { "name" : "Menu 3", "url" : "menu3.html", "submenu" : [ { "name" : "menu 3 subitem 1", "url" : "menu3subitem1.html" }, { "name" : "menu 3 subitem 1", "url" : "menu3subitem1.html" } ] } ]; Here is the recursive function: Code: function buildMenuHTML(menuData,level) { var ul; if (level == 1) { ul = "<ul id='menu'>"; } else { ul = "<ul class='level" + level + "'>"; } for (i = 0; i < menuData.length; i++) { menuItemData = menuData[i]; ul += "<li>"; ul += "<a href='" + menuItemData.url + "'>" + menuItemData.name + "</a>"; if (typeof menuItemData.submenu != 'undefined') { ul += buildMenuHTML(menuItemData.submenu,level + 1); } ul += "</li>"; } ul += "</ul>"; return ul; } Here is how the function is called initially: Code: buildMenuHTML(test,1); This is it's return value (with indentation added for readability): Code: <ul id='menu'> <li><a href='menu1.html'>Menu 1</a> <ul class='level2'> <li><a href='menu1subitem1.html'>menu 1 subitem 1</a></li> <li><a href='menu1subitem2.html'>menu 1 subitem 2</a></li> </ul> </li> </ul> 'Menu 2' and 'Menu 3' don't show up! I'm sure it's something small that I'm overlooking, but any help would be appreciated. Note: major noobage here I'm sure... but can't seem to figure this out... How do I make these three functions into one script? Much love if you can help! Code: <script type="text/javascript"> setTimeout('yourFunction();', 2500); function yourFunction(){ document.getElementById('hide').style.display='block'; } </script> <script type="text/javascript"> setTimeout('yourFunction2();', 8000); function yourFunction2(){ document.getElementById('hide').style.position='fixed'; } </script> <script type="text/javascript"> setTimeout('yourFunction3();', 8500); function yourFunction3(){ document.getElementById('hide').style.margin='0 -310px'; } </script> <script type="text/javascript"> setTimeout('yourFunction4();', 15500); function yourFunction4(){ document.getElementById('hide').style.margin='0 610px'; } </script> Hi everyone, i thought about following code snippet: Code: var newfunc = function() { //... } func = (function (oldfunc,newfunc) { return function () { oldfunc(); newfunc(); } }(func || function(){},newfunc)) There is a function "func" and with the above method i want to add a new function "newfunc" to this function, so when i call "func" in the futur, both functions will be executed. It works good, but suppose i want to add multiple functions to func, each time with the described method...could there be a problem with the stack? As far as i understand, the program creates something like a wrapper-function each time, that contains the two functions it combines. So in the case of adding 3 functions, a call of "func" would lead to this: call "wrapper 2", call "wrapper 1", call func1, call func2, call func3, call func 4. The really poor graphic should illustrate what i mean __________ F1|....|....| __|W1|....| F2|....|....| __|___|W2| ...|F3 |....| ...|___|___| ..........| F4| ..........|___| Has anyone an idea, if my thoughts on that are correct oder if this behaviour could be a problem? And is there probably a better way to combine functions, so that all functions would be in one column? Thanks and Greetings! moon-safari Hi, I would like to do something like this: Code: function searchLocations(count) { var found = false; var input = document.getElementById('autocomplete').value; var inp = input.toLowerCase(); var count = 0; for (var j = 0; j < gmarkers.length; j++) { gmarkers[j].hide(); var str=gmarkers[j].myname.toLowerCase(); var patt1=inp; if (str.match(patt1)) { found = true; gmarkers[j].show(); count++; } } if (count==1) myclick(j); if (count>1) centerZoom(); if ( ! found ) alert("No matches found. Please check your spelling or refine your search."); } on this page here, but the functions - myclick(j); and centerZoom(); aren't getting called. I tried it with switches here, but that only made things worse. I know the functions work because if I put them two } up, they get called, but that takes them out of the if statements. Those if (count...) statements have to be where they are so that "count" will get the right value. Any ideas? Is it possible to make a variable available to other functions outside a function So to make it global from within a function without using a callback Code: function() { var something = 'hello'; } function(something) { document.write(something); } something like that possible?? |