www.webdeveloper.com
Results 1 to 5 of 5

Thread: Writing with timer

  1. #1
    Join Date
    Apr 2012
    Posts
    3

    Question Writing with timer

    Hello,

    is my first post here and maybe is a silly question but im starting webdeveloping so here it goes.

    Code:
            var size;
    	var countdown_number;
    	var name;
    	var div;
    	var working;
    
            function load()
    		{			
    			name = "xxx xxx xxxxxxx";
    			div = "nome";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();
    		}
    		
    		function countdown_trigger() {
    			if(countdown_number < size-1) {				
    				countdown_number++;
    				if (name[countdown_number]==" ") {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + "&nbsp";
    				} else {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + name[countdown_number];
    				}
    				if(countdown_number < size) {					
    					countdown = setTimeout('countdown_trigger()', 200);
    				}
    			} 
    		}
    i want to write the string one char each time... is working on Chrome but it isnt working on Firefox.
    Another problem that i have is if i wanna call countdown_trigger() function again it doesn't work, or better it works only for my last call writing the first char of whatever i called for before. so i thought:

    Code:
            var size;
    	var countdown_number;
    	var name;
    	var div;
    	var working;
            
            function load()
    		{
    			
    			
    			working = true;
    			name = "09 / 07 / 1985";
    			div = "data_nascimento";
    			size = name.length;
    			
    			countdown_number=-1;
    			countdown_trigger();
    			while (working) {
    			}
    			working = true;
    			name = "xxx xxx xxxxx xxx";
    			div = "nome";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();
    		}
    		
    		function countdown_trigger() {
    			if(countdown_number < size-1) {				
    				countdown_number++;
    				if (name[countdown_number]==" ") {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + "&nbsp";
    				} else {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + name[countdown_number];
    				}
    				if(countdown_number < size) {					
    					countdown = setTimeout('countdown_trigger()', 200);
    				}
    			} else {
    				working = false;
    			}
    		}
    it enters in cicle without stoping... i wanna to right the first sentence on his div and the other on other div...

    Anybody can help me? Thank you!

  2. #2
    Join Date
    Jan 2012
    Posts
    31
    is working on Chrome but it isnt working on Firefox
    Are you getting any errors? Most browsers now have developer tools so you can look at what errors are be sent to the console. Or for firefox you can get the firebug addon, its a lot nicer than the built in tools.

    Another problem that i have is if i wanna call countdown_trigger() function again it doesn't work
    You need a ";" after countdown_trigger()
    Code:
    setTimeout('countdown_trigger();', 200);
    it enters in cicle without stoping..
    For the infinite loop problem.
    Code:
    function load()
    {
    	working = true;
    	// other code here
    	while (working) {
    	}
    	//other code here
    }
    Since the "setTimout" syntax is wrong, your code never sets "working" to "false". So you end up running an infinite while loop. But the bigger issue is why that while is even in your code, it is doing nothing but looping indefinitely.

    Now if you do need it for some future code, after you have fixed the "setTimeout", you should be aware it will still cause you a problem. It appears that onload you set "working" to "true" and then run the "countdown_trigger()" function, which you are thinking will set "working to "false" when it ends, which it will, but not before the "while" loop is run. When calling setTimeout javascript places that function in a queue and will run any other code while it waits for the time to elapsed. But since the next thing to run, is an infinite while loop, it has to wait till that loop finishes before it can execute the function that "setTimeout" queued.

  3. #3
    Join Date
    Apr 2012
    Posts
    3

    Question


    is working on Chrome but it isnt working on Firefox
    Are you getting any errors? Most browsers now have developer tools so you can look at what errors are be sent to the console. Or for firefox you can get the firebug addon, its a lot nicer than the built in tools.
    I use Firebug and it doesnt give me any error on Mozilla

    Another problem that i have is if i wanna call countdown_trigger() function again it doesn't work
    You need a ";" after countdown_trigger()

    Code:
    setTimeout('countdown_trigger();', 200);
    Well i correct the error but still it doesn't work at it should it just dont write one sentence, then another, etc...

    here is all my code:
    Code:
    <html>
    <head>
    	<script type="text/javascript">
    	var size;
    	var countdown_number;
    	var name;
    	var div;
    	var working;
    		function load()
    		{
    			//Inserir Nome
    			name = "xxx xxxx xxxxx";
    			div = "nome";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();			
    			//Inserir Nacionalidade
    			name = "Portugal";
    			div = "nacionalidade";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();			
    			//Inserir Email
    			name = "xxxxxx@xxxx.com";
    			div = "email";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();			
    			//Inserir Nacionalidade
    			name = "99 999 990";
    			div = "telemovel";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();			
    			//Inserir Data de Nascimento
    			working = true;
    			name = "09 / 07 / 1985";
    			div = "data_nascimento";
    			size = name.length;			
    			countdown_number=-1;
    			countdown_trigger();	
    		}
    		
    		function countdown_trigger() {
    			if(countdown_number < (size-1)) {				
    				countdown_number++;
    				if (name[countdown_number]==" ") {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + "&nbsp";
    				} else {
    					document.getElementById(div).innerHTML = document.getElementById(div).innerText + name[countdown_number];
    				}
    				if(countdown_number < size) {					
    					countdown = setTimeout('countdown_trigger();', 200);
    				}
    			}
    		}
    	</script>
    </head>
    <body onload="load()">
    	<table border="1">
    		<tr>
    			<td>Nome completo:</td>
    			<td width="400"><div id="nome"></div></td>
    		</tr>
    		<tr>
    			<td>Nacionalidade:</td>
    			<td><div id="nacionalidade"></div></td>
    		</tr>
    		<tr>
    			<td>E-m@il:</td>
    			<td><div id="email"></div></td>
    		</tr>
    		<tr>
    			<td>Telemóvel:</td>
    			<td><div id="telemovel"></div></td>
    		</tr>
    		<tr>
    			<td>Data de Nascimento:</td>
    			<td><div id="data_nascimento"></div></td>
    		</tr>
    	</table>
    </body>
    </html>
    Do you mind to take a look? i dont know what is happening... and i have a job interview Tomorrow and i would like to take this donne.

    Thank you

  4. #4
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,635
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>title</title>
    <script type="text/javascript">
    var cdwn='',
    info=[
    ["xxx xxxx xxxxx","nome"],
    ["Portugal","nacionalidade"],
    ["xxxxxx@xxxx.com","email"],
    ["99 999 990","telemovel"],
    ["09 / 07 / 1985","data_nascimento"]
    ];
    
    function countdown_trigger(name,id,size,countdown_number){
    if(countdown_number < (size-1)){
    countdown_number++;
    if(name[countdown_number]==" "){document.getElementById(id).innerHTML += "&nbsp";}
    else{document.getElementById(id).innerHTML += name[countdown_number];}
    if(countdown_number < size){cdwn = setTimeout('countdown_trigger("'+name+'","'+id+'",'+size+','+countdown_number+');', 200);}
    }
    }
    function x(){for(var i in info){countdown_trigger(info[i][0],info[i][1],info[i][0].length,-1);}}
    </script>
    </head>
    <body onload="x()">
    	<table border="1">
    		<tr>
    			<td>Nome completo:</td>
    			<td width="400"><div id="nome"></div></td>
    		</tr>
    		<tr>
    			<td>Nacionalidade:</td>
    			<td><div id="nacionalidade"></div></td>
    		</tr>
    		<tr>
    			<td>E-m@il:</td>
    			<td><div id="email"></div></td>
    		</tr>
    		<tr>
    			<td>Telemovel:</td>
    			<td><div id="telemovel"></div></td>
    		</tr>
    		<tr>
    			<td>Data de Nascimento:</td>
    			<td><div id="data_nascimento"></div></td>
    		</tr>
    	</table>
    </body>
    </html>
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  5. #5
    Join Date
    Apr 2012
    Posts
    3
    Hello again,

    Everything is running good now.

    Thank you for the Tips and Code _Krik_ and Padonak.

    See you around i will try help other users as you guys helped me.


Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles