JavaScript - Clearing The Memory After A Trip To The Server?
ok, i'm sure you all will laugh at this, but it seems really bizzario to me.
i have two small routines worked out. routine G gets a value out of the db and brings it back to the browser script. routine P puts a value into the db from the browser script. they both run fine. but......... you have to turn the browser totally off and restart it after retrieving a value out of the db (?) why? is this some kind of "clear memory" i need to be doing. its like the last value i retrieved thru the server is stuck in memory and keeps coming up, and it won't flush out until i turn the browser off and restart it. is this a Javascript problem or a PHP problem? i dont' have a clue, maybe i need to somehow flush the memory in the PHP file after i echo() back the result.? is that normal? thanks, Paul Similar TutorialsHey guys, First shot at JS so please be gentle! I'm trying to get this script to clear the default value of my input elements on focus. It works well the first time, however, if a user inputs some fresh text, selects something else, then selects the same input element again, it will clear the text they entered. Make sense? Here's the script (thanks in advance!!): Code: <script language="JavaScript"> function clickFocus(input){ input.className = 'focus'; if (input.value = input.defaultValue){ input.value = ''; } } function unFocus(input){ input.className = 'entered'; if (input.value == ''){ input.value = input.defaultValue; input.className = 'normal' } } </script> <form action="confirmation.php" method="post" enctype="multipart/form-data" name="form" id="form" onsubmit="return checkForm(this)"> <input type="text" name="name" value="Name" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <input type="text" name="email" value="Email" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <input type="text" name="subject" value="Subject" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <textarea type="text" name="message" onfocus="clickFocus(this)" onblur="unFocus(this)" rows="5">Message</textarea> <input class="submit" name="submit"type="submit" value="Send Message" /> </form> I was wondering if there is a way to find the total round trip time of a request. Addins like firebug and chromes console show you this round trip time but i was hoping there was a way to extract it from the response itself. I would also like to know the response time from when the server sent the request and the client received it. I do not think this is possible since the server and client have different timing systems but it would be very useful. I have the following JavaScript (see below). The script requests an XML file from the server and displays it on the page. The script works fine when the requested XML file is stored on the same server as the script. The problem is when I try requesting an XML file from an external server such as the National Weather Service. I get an error. If I take the XML file from the National Weather Service and save it to my server it works. Why can't I use my script to request XML files stored on external servers? Thanks in advance for any help. Javascript Code Code: window.onload = initAll; var xhr = false; function initAll() { document.getElementById("makeTextRequest").onclick = getNewFile; document.getElementById("makeXMLRequest").onclick = getNewFile; } function getNewFile() { makeRequest(this.href); return false; } function makeRequest(url) { if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { } } } if (xhr) { xhr.onreadystatechange = showContents; xhr.open("GET", url, true); xhr.send(null); } else { document.getElementById("updateArea").innerHTML = "Sorry, but I couldn't create an XMLHttpRequest"; } } function showContents() { if (xhr.readyState == 4) { if (xhr.status == 200) { if (xhr.responseXML && xhr.responseXML.contentType=="text/xml") { var outMsg = xhr.responseXML.getElementsByTagName("choices")[0].textContent; } else { var outMsg = xhr.responseText; } } else { var outMsg = "There was a problem with the request " + xhr.status; } document.getElementById("updateArea").innerHTML = outMsg; } } HTML Code 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> <title>My First Ajax Script</title> <script type="text/javascript" src="script01.js"></script> </head> <body> <p><a id="makeXMLRequest" href="http://www.weather.gov/xml/current_obs/KOJC.xml">Request an XML file</a></p> <div id="updateArea"> </div> </body> </html> Hi every1! Got a task in university to make a memory game (card matching game). Thats what i've got so far: Code: var selected = 0; var choiceOne; var choiceTwo; var matches = 0; var numOfTries = 0; var interval = 700; var gamePlace = document.getElementById("wrap"); var backcard="img/memoryBg.png"; var timeStart; var timeFinish; var time; function nameEnter(){ var name = prompt("Please enter your name"); if (name != null){ document.title = "Welcome " + name + "!"; } } function game(){ var nOfPairs = document.getElementById("nPairs").value; timeStart = new Date().getTime(); if (nOfPairs==1){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; } if (nOfPairs==2){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==3){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==4){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==5){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==6){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards.sort(function shuffle() { return Math.random() - 0.5;}); } if (nOfPairs==7){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if (nOfPairs==8){ var cards=[]; cards[0] = 'img/card1.png'; cards[1] = 'img/card1.png'; cards[2] = 'img/card2.png'; cards[3] = 'img/card2.png'; cards[4] = 'img/card3.png'; cards[5] = 'img/card3.png'; cards[6] = 'img/card4.png'; cards[7] = 'img/card4.png'; cards[8] = 'img/card5.png'; cards[9] = 'img/card5.png'; cards[10] = 'img/card6.png'; cards[11] = 'img/card6.png'; cards[12] = 'img/card7.png'; cards[13] = 'img/card7.png'; cards[14] = 'img/card8.png'; cards[15] = 'img/card8.png'; cards.sort(function shuffle(){ return Math.random() - 0.5;}); } if(nOfPairs>8||nOfPairs<1){ alert("Please enter the number from 1 to 8"); }else{ for(i = 0; i<=nOfPairs*2-1; i++){ var cardDiv = document.createElement("div"); cardDiv.setAttribute("id",""+i+""); cardDiv.style.height="65px"; cardDiv.style.width="65px"; cardDiv.style.float='left'; gamePlace.appendChild(cardDiv); document.getElementById(""+i+"").innerHTML='<img src="img/memoryBg.png">'; cardDiv.onclick=function(){cardClick(this.id);}; } } function cardClick(card){ if (selected==2){ return ; } if (selected==0){ choiceOne=card; document.images[card].src = cards[card]; selected = 1; }else { selected = 2; choiceTwo = card; document.images[card].src =cards[card]; var timer=setInterval(checking,interval); } function checking() { clearInterval(timer); numOfTries++; document.getElementById("tries").innerHTML = numOfTries; if (cards[choiceTwo]==cards[choiceOne]){ matches++; document.images[choiceOne].src = "img/memoryBgI.png"; document.images[choiceTwo].src = "img/memoryBgI.png"; //choiceTwo.onclick=null; } else { document.images[choiceOne].src = "img/memoryBg.png"; document.images[choiceTwo].src = "img/memoryBg.png"; selected = 0; return ; } if (matches == nOfPairs){ timeFinish = new Date().getTime(); time = Math.round (((timeFinish - timeStart)/1000)); alert("Congrats! You needed " + numOfTries + " tries, and " + time + " seconds."); } selected = 0; return ; } } } so the problem is, that I can just click 2 times on one card and it will look like a coincidence. My second problem is that when I have a real coincidence, I can still click on that card (by "real coincidence" i mean two same pics. so when i find them, they have to be not active, and when im clicking on them, they should just simply do nothing.). Can someone help me? Hi everyone, Really hoping someone can help me with a javascript / memory problem I'm having. Environment is Win7, MSIE v8.0. I have a pretty simple test function for this problem: Code: function go() { // create giant text string in variable 'bill' then set 'bill' to null - store inside variable called 'test' as text. var test = "bill = 'blah blah blah blah blah (repeat blah about a thousand times or so for file size)'; bill = null;"; // execute text inside variable 'test' as code var tester = new Function(test); // destroy function used to execute string as code tester = null; } now, when you trigger the function go() through a button (ie <button onclick='go();'>go</button>) you can watch the memory usage in taskmgr go up every time you click the button (for me it goes up about 3MB every time go() is called - but that will depend on how many blah's you have). I have tried replacing var tester = new Function(test); with the eval() command... Same problem. It would appear the function is creating (storing in memory) a new instance every time its called ... What am I doing wrong here?? How do I stop the memory increasing every time i try to execute the string 'test' as script? Checked this code in Chrome and Firefox - they don't seem to have any memory issues running this code - its only a IE issue (*sigh*). That doesnt help me as the problem relates to a client's HTA application (can't switch off IE engine). Huge thanks in advance! I've created a web application which uses just JS\Jquery\ajax, without any page reloads. The issue is, it starts working really slow after using it for a while since it probably has lots of memory leaks. No i'm reading about memory consumption and memory leaks and my first question is about the following scenario. I have an ajax request each second which checks for new messages. and when i get the response, the following loop is part of the code. Code: for (i=0; i<pm_length; i++) { var content = data.pm[i].content; var mood = data.pm[i].mood; var time_added = data.pm[i].time_added; var fb_id = data.pm[i].user_id; var msg_id = data.pm[i].id; var user_status = data.pm[i].user_status; var full_name = data.pm[i].first_name + " " + data.pm[i].last_name; if($("#pm"+fb_id).length == 0) { var closetab = '<a class="close">x</a>'+full_name; $(".tabs").append('<li class="bot_room" id="pm'+fb_id+'" type="pm" tab="#tabpm'+fb_id+'">'+closetab+'</li>'); $(".tab_container").append('<div id="tabpm'+fb_id+'" class="tab_content" style="display: none;"></div>'); } create_message('pm'+fb_id, msg_id, fb_id, full_name, content, 'no', user_status, time_added, mood); if($("#pm_alert").attr('checked')) { soundManager.onready(function(){ var mySound = soundManager.createSound({ id:'mySound1', url:'images/new_msg.mp3' }); mySound.play(); mySound = null; }); } content = null; mood = null; time_added = null; fb_id = null; msg_id = null; user_status = null; full_name = null; } and my question is, is there a reason to actually null the variables if they will be redeclared any way on the following second? Okay, so I'm making something so IF the number is BETWEEN this number, and that number, I want it to display a certain number. Ex. Code: var Num1 = 100 var Num2 = 200 var Num3 = 1 If (Num1{THIS IS WHAT I DON'T KNOW}Num2) { alert(Num3) } Also, could somebody please tell me what those are called? The; == != || etc. Because I was having a TERRIBLE time trying to google that. AHH! I'm sorry for this. I know this is a stupid question. Hi: I was trying to post in flowplayer forum but... Anyway, the code below works fine when run with browser called from Coffee Cup HTML editor. Files are played as requested from button onClick events. All files called and all ref files are on hosting server. When I put this page on the server and click the first button, the files play fine. When I then click thge second button, the files called by the first button play again. If I then click the second button, the files called by button 2 play. If I then click button 5, the files called by button 2 play again. The previous config is somehow being stored somewhere and called. I have added this and that as you can see in the code to try to rid the old config but to no avail: playerConfig = null playerConfig.playlist =[]; should clear it. delete playerConfigplaylist[0]; Should clear it. and thinking it was bumped to [1] delete playerConfigplaylist[1]; Should clear that. So I think the old playerConfig.playlist should be gone but apparently not so. I have reviewed: jquery.min.js, flowplayer-3.2.6.min.js and flowplayer.playlist-3.0.8.js and cannot see any cause to this behavior though I am not a js ace. Any insight appreciated. Best regards <code> <script> var mediaPlayer = null; var playerConfig = null; function createPlayerConfig () { playerConfig = null; playerConfig = { log: { level: 'debug' } , play: null, plugins: { controls: { url: 'https://www.jala-mi.org/gmfiles/flowplayer.controls-3.2.5.swf', bottom: 0, height: 24, backgroundColor: "#2d3e46", backgroundGradient: "low", fontColor: '#ffffff', timeFontColor: '#333333', autoHide: 'never', play:true, volume:true, mute:true, time:true, stop:true, playlist:true, fullscreen:true, scrubber: true } } } }; function changePlaylist(newplaylist,no_of_items) { playerConfig.playlist = []; delete playerConfig.playlist[0]; for(i=0; i < no_of_items; i++) { playerConfig.playlist[i] = newplaylist; } delete playerConfig.playlist[1]; createPlayer(); // reload player with new playlist mediaPlayer.play(); // start the newly loaded clip sequence* } function createPlayer() { if(mediaPlayer != null) { if(mediaPlayer.isLoaded()) { mediaPlayer.unload(); mediaPlayer = null; } } $f("player", { src:"https://www.jala-mi.org/gmfiles/flowplayer-3.2.7.swf" }, playerConfig ); mediaPlayer = $f("player"); } function loadandplay(intro, movie) { var presentation = {url: movie , duration: 0, autoPlay: true, autoBuffering: false, fadeInSpeed: 8000, fadeOutSpeed: 5000, title: 'JPD 02/28/2011',playlist: [{url: intro , duration: 0, position: 0, fadeInSpeed: 5000, fadeOutSpeed: 8000, autoPlay: true, autoBuffering: true, }] }; createPlayerConfig(); changePlaylist(presentation, 1); }; </script> </code> html <code> <div id="side"> <br><br> <input type="button" class="plbtn" value="November 2010" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/Intro112210.flv', 'https://www.jala-mi.org/gmfiles/collections112210.flv')"> <br> <input type="button" class="plbtn" value="January 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> <input type="button" class="plbtn" value="February 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/Intro22811.flv', 'https://www.jala-mi.org/gmfiles/jpd_3.flv')"> <br> <input type="button" class="plbtn" value="March 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/Intro32811.flv', 'https://www.jala-mi.org/gmfiles/assets32811.flv')"> <br> <input type="button" class="plbtn" value="April 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> <input type="button" class="plbtn" value="May 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> <input type="button" class="plbtn" value="September 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> <input type="button" class="plbtn" value="October 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> <input type="button" class="plbtn" value="November 2011" style="background-color:#0D4A80; color:#fff" onClick="javascript:loadandplay('https://www.jala-mi.org/gmfiles/intronone.flv', 'https://www.jala-mi.org/gmfiles/')"> <br> </div> </code> I am using firefox 8. Is there a way is seeing the details of its memory usage please? Many thanks for any help, S Greeting....! Does anyone know that how's the JavaScript memory model work? I mean as we know that a Stack stores primitive type variables and references, a Heap stores referenced type object, what about functions? Should functions are stored at a Memory or what I said is wrong. Is there any books or resources are talking about JavaScript Memory Model? Thanks a lot!!!! Dan Doing some RSA encryiption in java script Nothing big, strings like max 20 chars in lenght. After a couple (random, could be 10 or 50 or anything operations) of that, browser does not freeze, server does not freeze but wont work anymore on any string, i.e same result for any string. Restarting browser helps. What should I look for, are there any tools for FF to look for js memory leaks an such ? I'm sort of new at JS and trying to have an option to clear the fields by pressing the clear fields button, but nothing happens. This should be correct but for some odd reason it's not.. In addition, I have to edit my fuction doSubmit so once submitted an alert box with all the information is in it.. Does that make sense So the alert should be: John Does 462 Smith St Johnston, NC 44524 Email@com 214-854-6555 Etc Code: <script> function doClear() { document.PizzaForm.customer.value = ""; document.PizzaForm.address.value = ""; document.PizzaForm.city.value = ""; document.PizzaForm.state.value = ""; document.PizzaForm.zip.value = ""; document.PizzaForm.phone.value = ""; document.PizzaForm.email.value = ""; document.PizzaForm.sizes[0].checked = false; document.PizzaForm.sizes[1].checked = false; document.PizzaForm.sizes[2].checked = false; document.PizzaForm.sizes[3].checked = false; document.PizzaForm.toppings[0].checked = false; document.PizzaForm.toppings[1].checked = false; document.PizzaForm.toppings[2].checked = false; document.PizzaForm.toppings[3].checked = false; document.PizzaForm.toppings[4].checked = false; document.PizzaForm.toppings[5].checked = false; document.PizzaForm.toppings[6].checked = false; document.PizzaForm.toppings[7].checked = false; return; } function doSubmit() { alert("Your pizza order has been submitted."); return; } </script> </head> <body> <form name="PizzaForm"> <h1>Pizza Parlor</h1> <p> <h4>Step 1: Enter your name, address, phone number, and email address:</h4> <font face="Courier New"> Name: <input name=:customer" size="50" type="text"><br> Address: <input name="address" size="50" type="text"><br> City: <input name="city" size="15" type="text"> State: <input name="state" size="2" type="TEXT"> Zip: <input name="zip" size="5" type="text"><br> Phone: <input name="phone" size="50" type="text"><br> Email: <input name="email" size="50" type="text"><br> </font> </p> <p> <h4>Step 2: Select the size of pizza you want:</h4> <font face="Courier New"> <input name="sizes" type="radio">Small <input name="sizes" type="radio">Medium <input name="sizes" type="radio">Large <input name="sizes" type="radio">Jumbo<br> </font> </p> <p> <h4>Step 3: Select the pizza toppings you want:</h4> <font face="Courier New"> <input name="toppings" type="checkbox">Pepperoni <input name="toppings" type="checkbox">Canadanian Bacon <input name="toppings" type="checkbox">Sausage<br> <input name="toppings" type="checkbox">Mushrooms <input name="toppings" type="checkbox">Pineapple <input name="toppings" type="checkbox">Black Olives<br> <input name="toppings" type="checkbox">Extra Cheese <input name="toppings" type="checkbox">Green Peppers<br> </font> </p> <input type="button" value="Submit Order" onClick="doSubmit()"> <input type="button" value="Clear Entries" onClick="doClear()"> </form> </body> I'm designing a page to fade multiple images (three) in and out over a set period of time (one minute, say). The code I have works as follows: I define an array and fill it with the div objects I want to fade in and out. I have some simple tags (2 for opaque, 1 for fading in, -1 for fading out, etc.) that I set to show the state of the object. First I check if the object is opaque, and if so set it to fade along with a time; Or if it's transparent I give it a 1 in 10 chance of fading in during this iteration. If it's currently fading in or out I check to make sure it's on track and change the opacity of the div accordingly. Originally, I had the function call back to itself using setTimeout after the loop had gone through all the divs and changed their opacities appropriately. This caused an out of memory error (though, strangely, if I had any alerts in the function it didn't give me the error). So the version below has the code in a while loop to let it run for 20 seconds - this gives me the "a script...run slowly, do you want to continue the script?" message. So I have several questions: 1) First and foremost, why is my function causing out of memory/run slowly errors and what is the best way to fix that? 2) Is there a better way to code this effect (final result will be six lights fading in and out for a minute or so). 3)I'm not an experienced programmer, so any bad practices, ways to streamline, no no's, etc. that you see, please point out. I've only posted the script here - the page simple consists of three divs (id's grad0, grad1, grad2) and a call to the function copied here. Thanks in advance. Code: function commencez(){ //parent function to store var's var TimeToFade = 10000; theArray = new Array(2); var wrench = new Date().getTime(); for (var a=0; a<3; a++){ //fill the array with objects theArray[a] = document.getElementById("grad" + a); theArray[a].FadeState = -2; //start them transparent } function fader() { var check = new Date().getTime(); //stops the function after 30 seconds if( check <= wrench + 30000 ) { return; } for(var i=0; i<3; i++){ if (theArray[i].FadeState !=1 && theArray[i].FadeState != -1) { if( theArray[i].FadeState == 2) { theArray[i].FadeState = -1; theArray[i].FadeTimeLeft = TimeToFade; theArray[i].FadeBegan = new Date().getTime(); } if( theArray[i].FadeState == -2) { var rndm=Math.floor(Math.random()*11); if( rndm == 1) { theArray[i].FadeState = 1; theArray[i].FadeTimeLeft = TimeToFade; theArray[i].FadeBegan = new Date().getTime(); } } } if( theArray[i].FadeState == 1 || theArray[i].FadeState == -1) { var now = new Date().getTime(); since = now - theArray[i].FadeBegan; if( theArray[i].FadeTimeLeft <= since ) { theArray[i].style.opacity = theArray[i].FadeState == 1 ? '1' : '0.2'; theArray[i].style.filter = 'alpha(opacity = ' + (theArray[i].FadeState == 1 ? '100' : '20') + ')'; theArray[i].FadeState = theArray[i].FadeState == 1 ? 2 : 2; } theArray[i].FadeTimeLeft -= since; var howMuch = theArray[i].FadeTimeLeft / TimeToFade; if( theArray[i].FadeState == 1) { howMuch = 1-howMuch; theArray[i].style.opacity = howMuch; theArray[i].style.filter = 'alpha(opacity = ' + (howMuch*100) + ')'; } if( theArray[i].FadeState == -1) { theArray[i].style.opacity = howMuch; theArray[i].style.filter = 'alpha(opacity = ' + (howMuch*100) + ')'; } } } //close the for loop setTimeout( fader() , 500); //last thing fader does is recall itself after half a second } //close the fader function fader(); } //close parent function </script> I'm working on a Virtual Tabletop project and am running into issues where tons of memory is accumulated. I've set up a test where 502 pieces are on the board and every second the board randomly zooms in/out 5%. After 30 seconds, I clear the interval. http://ontodevelopment.com/boardtest/ When the board zooms, every game piece has has to be re-sized. Using Firefox, watch the memory go up but never come back down. In IE and Chrome the leak is no where near as bad. Any ideas or pointers would be appreciated. I need to learn how to clear form fields when a user clicks on them. Here is the site in question: http://www.yourvancouvermortgagebroker.ca/apply They used to work, but then I changed the field value and now it doesn't work on some of the fields (whichever ones I changed). Here is a link to the .js file: http://www.yourvancouvermortgagebroker.ca/js/apply.js okay. clearing a form. I have a clear button. when I push it, I want all the red text boxes and onblur messages to disappear. anyone have an idea on where i can start? heres javascript Code: function isFormValid() { var userF = document.getElementById('FName').value; var userL = document.getElementById('LName').value; var userPW = document.getElementById('pw').value; var userPW2 = document.getElementById('pw2').value; var userBDay = document.getElementById('BDay').value; var userEmail = document.getElementById('email').value; var NameFormat = /^[A-Za-z]{2,12}$/; var PWFormat = /^[A-Za-z0-9]{6,12}$]/; var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/; var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/; var retVal = true; var errorMsg = ""; if (!NameFormat.test(userF)) { assignErrorClass("FName"); errorMsg = "First Name is required. 2-12 letters only\n"; retVal = false; } if (!NameFormat.test(userL)) { assignErrorClass("LName"); errorMsg = errorMsg + "Last Name is required. 2-12 letters only\n"; retVal = false; } if (!PWFormat.test(userPW)) { assignErrorClass("pw"); errorMsg = errorMsg + "Password is required. 6-12 letters or numbers only.\n"; retVal = false; } if (userPW2 == "") { assignErrorClass("pw2"); errorMsg = errorMsg + "Please Retype password.\n"; retVal = false; } if ((userPW != userPW2) && (userPW2 !== "")) { assignErrorClass("pw2"); errorMsg = errorMsg + "Passwords do not match.\n"; retVal = false; } if (userBDay == "") { assignErrorClass("BDay"); errorMsg = errorMsg + "Please Enter a Birthday.\n"; retVal = false; } if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) { assignErrorClass("BDay"); errorMsg = errorMsg + "Incorrect Birthday format\n"; retVal = false; } if (badBirthday("BDay") && (userBDay !== "")) { assignErrorClass("BDay"); retVal = false; errorMsg = errorMsg + "Invalid Birthday\n"; } if (userEmail == "") { assignErrorClass("email"); errorMsg = errorMsg + "Please Enter an Email address.\n"; retVal = false; } if ((!EmailFormat.test(userEmail)) && (userEmail !== "")) { assignErrorClass("email"); errorMsg = errorMsg + "Please Enter a valid Email address.\n"; retVal = false; } if (!retVal) { alert( errorMsg); } return retVal; } function assignErrorClass(objName) { var obj = document.getElementById(objName); obj.className = "err"; } function badBirthday( objName) { var obj = document.getElementById(objName); var dateStr = obj.value; var mn = dateStr.split("/")[0]; var dy = dateStr.split("/")[1]; var yr = dateStr.split("/")[2]; var dateObj = new Date(yr,mn-1,dy); //JavaScript and PHP number the months 0 to 11. if (dateObj.getFullYear() != yr || dateObj.getMonth()+1 != mn || dateObj.getDate() != dy) { return true; } else { return false; } } function checkFName() { var userF = document.getElementById('FName').value; var elementF = document.getElementById('labelFName'); var NameFormat = /^[A-Za-z]{2,12}$/; if (!NameFormat.test(userF)) { elementF.innerHTML = "First Name is required. 2-12 letters only"; elementF.style.color = "red"; } else { elementF.innerHTML = ""; elementF.style.color = "green"; } } function checkLName() { var userL = document.getElementById('LName').value; var elementL = document.getElementById('labelLName'); var NameFormat = /^[A-Za-z]{2,12}$/; if (!NameFormat.test(userL)) { elementL.innerHTML = "Last Name is required. 2-12 letters only"; elementL.style.color = "red"; } else { elementL.innerHTML = ""; elementL.style.color = "green"; } } function checkpw() { var userPW = document.getElementById('pw').value; var elementPW = document.getElementById('labelpw'); var PWFormat = /^[A-z0-9]{6,12}$/; if (!PWFormat.test(userPW)) { elementPW.innerHTML = "Password is required. 6-12 letters or numbers only."; elementPW.style.color = "red"; } else { elementPW.innerHTML = "Good Password"; elementPW.style.color = "green"; } } function checkpw2() { var userPW2 = document.getElementById('pw2').value; var userPW = document.getElementById('pw').value; var elementPW2 = document.getElementById('labelpw2'); if ((userPW != userPW2) && (userPW2 !== "")) { elementPW2.innerHTML = "Passwords do not match."; elementPW2.style.color = "red"; } else if (userPW2 == "") { elementPW2.innerHTML = "Please Retype password."; elementPW2.style.color = "red"; } else { elementPW2.innerHTML = "Passwords Match"; elementPW2.style.color = "green"; } } function checkBDay() { var userBDay = document.getElementById('BDay').value; var elementBDay = document.getElementById('labelBDay'); var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/; if (userBDay == "") { elementBDay.innerHTML = "Please enter A Birthday."; elementBDay.style.color = "red"; } else if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) { elementBDay.innerHTML = "Please enter mm/dd/yyyy format."; elementBDay.style.color = "red"; } else if ((badBirthday("BDay")) && (userBDay !== "")) { elementBDay.innerHTML = "Please enter valid Birthday."; elementBDay.style.color = "red"; } else { elementBDay.innerHTML = ""; elementBDay.style.color = "green"; } } function checkEmail() { var userEmail = document.getElementById('email').value; var elementEmail = document.getElementById('labelEmail'); var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/; if ((!EmailFormat.test(userEmail)) && (userEmail !== "")) { elementEmail.innerHTML = "Please enter a Valid Email address."; elementEmail.style.color = "red"; } else if (userEmail == "") { elementEmail.innerHTML = "Please enter an Email address."; elementEmail.style.color = "red"; } else { elementEmail.innerHTML = ""; elementEmail.style.color = "green"; } } heres the html Code: <form action="mailto:hummdedum@felloff.com" method="post" name="form" onSubmit="return isFormValid();"> * First Name: <input type="text" name="FName" id="FName" onblur="checkFName();"/><label id="labelFName"></label><br /> * Last Name: <input type="text" name="LName" id="LName"onblur="checkLName();"/><label id="labelLName"></label><br /> * Password: <input type="password" id="pw" name="Password" onblur="checkpw();"/><label id="labelpw"></label><br /> *Re-type Password: <input type="password" name="2Password" id="pw2" onblur="checkpw2();" /><label id="labelpw2"></label><br /> I am a: <br /> <input type="radio" name="status" value="fresh" /> Freshman<br /> <input type="radio" name="status" value="soph" /> Sophomore<br /> <input type="radio" name="status" value="jr" /> Junior<br /> <input type="radio" name="status" value="sr" /> Senior<br /> I am taking classes in the: <br /> <input type="checkbox" name="semester" value="fall" /> fall time<br /> <input type="checkbox" name="semester" value="spring" /> Spring time <br /> My favorite element is: <select name="element" id="element"> <option value="">select</option> <option value="fire">Fire</option> <option value="earth">Earth</option> <option value="water">Water</option> <option value="air">Air</option> </select><br /> *Birthday: mm/dd/yyyy<input type="text" id="BDay" name="Birthday" onblur="checkBDay();"/><label id="labelBDay"></label><br /> *E-Mail: <input type="text" id="email" name="Email" onblur="checkEmail();"/><label id="labelEmail"></label><br /> <input type="submit" value="Submit" /> <input type="reset" value="Clear" /> </form> css i guess would be Code: .err { border: 2px solid #FF0000;} #errMsg { font-size: 110%; color: #FF0000;} super thanks!!!!!! -pumpkin I'm trying to have a textbox clear after it has been filled and submitted. this is my form look.... Code: <form action="" name="webForm" id="webForm"> <div id="title0" class="pageTitle">Enter Student Dropping A Course: </div> <div id="fieldName">Name: <input type="text" id="fName" name="fName" size="40" maxlength="60" /></div> <div id="button"><input type="button" value="Add Latest Student To Drop A Course" onclick="addRecord()" /></div> </form> Sooo...in my javascript i'm coding it like this but for somereason it's not working Code: function resetForm() {//clear the value in the txt field document.getElementsById("fName").value = ""; } and i have it called from another function here... Code: function addRecord() { var old = XMLdoc.getElementsByTagName("studentName")[0]; //Declare var old and set it's value to the elements by tag name var clone = old.cloneNode(true); removeWhiteSpaceNodes(clone); clone.childNodes[0].nodeValue = webForm.elements[0].value; // set clone to value entered by user in text field XMLdoc.documentElement.appendChild(clone); //append the clone to the document object displayStudents(); resetForm(); .... any help? ..Much thanks Everyone! I need to clear the default value from a textarea when a user clicks on the textarea and then replace it if the user clicks away from the textarea without modifying it. I have managed to accomplish this with the textfields in my forms but I am struggling to get the textarea element to mimic this behavior. Here is the script I am using: Code: addEvent(window, 'load', init, false); function init() { var formInputs = document.getElementsByTagName('input'); for (var i = 0; i < formInputs.length; i++) { var theInput = formInputs[i]; if (theInput.type == 'text' && theInput.className.match(/\binput\b/)) { /* Add event handlers */ addEvent(theInput, 'focus', inputText, false); addEvent(theInput, 'blur', replaceDefaultText, false); /* Save the current value */ if (theInput.value != '') { theInput.defaultText = theInput.value; } } } } function inputText(e) { var target = window.event ? window.event.srcElement : e ? e.target : null; if (!target) return; if (target.value == target.defaultText) { target.value = ''; } } function replaceDefaultText(e) { var target = window.event ? window.event.srcElement : e ? e.target : null; if (!target) return; if (target.value == '' && target.defaultText) { target.value = target.defaultText; } } HTML: [HTML] <form action="#"> <fieldset> <legend></legend> <input type="text" value="Your Name" id="name" class="input" /> <label for="name">Name Required</label><br/> <input type="text" value="Your Email" id="email" class="input"/> <label for="email">E-mail Required</label><br/> <input type="text" value="Your Website" id="website" class="input"/> <label for="website">Website</label> <textarea rows="15" cols="71">Your Message Goes Here.</textarea> <input type="submit" value="Submit Comment" class="button" /> </fieldset> </form> [/HTML] I am really just trying to get this form to behave the way all other forms on the internet work- where text clears when a user clicks on a form element and replaces itself if the user doesn't enter new text. I have it working on the text field but no the textarea. Help! This is some of the script that I have and it works well. The story is that I have a drop down list and depending on the selection a different set of text is displayed below the list. Code: if (Val == "general") { document.getElementById('Link0').innerHTML="<font size=2><a Href='http://www.web1.com/'>web 1</a>" document.getElementById('Link1').innerHTML="<font size=2><a Href='http://www.web2.com/'>web 2</a>" However when the selection runs this part of the code:- Code: if (Val == "duties") { document.getElementById('Link0').innerHTML="" document.getElementById('Link1').innerHTML="<font size=2><a Href='http://www.web2.com/'>web3</a>" The "web 3" text is placed under where the 'Link0' text would have been if there had been some. So basically what I need to do is set the 'Link0' text to nothing and have the 'Link1' text sit in its place. I know I could just put the 'Link1' text in the 'Link0' element but I have other controls on the screen that mean I need to run it as it is. I hope that is clear, cheers Daniel. |