www.webdeveloper.com
Results 1 to 4 of 4

Thread: start stop countdown -please help !

  1. #1
    Join Date
    Jul 2012
    Posts
    29

    Question start stop countdown -please help !

    I cant seem to get this too work -

    here is the original code - i want it count 30-0 then repeat 30-0 firing an alert 1 and an alert 2 reaching 0

    promblem is it doesnt auto start counting

    i just want the buttons to stop count and restart count

    where you stopped it (ie 15 it will restart counting at 15 )


    <html>
    <head>
    <script type="text/javascript">
    var c=0;
    var t;
    var timer_is_on=0;

    function timedCount()
    {
    document.getElementById('txt').value=c;
    c=c+1;
    t=setTimeout("timedCount()",1000);
    }

    function doTimer()
    {
    if (!timer_is_on)
    {
    timer_is_on=1;
    timedCount();
    }
    }

    function stopCount()
    {
    clearTimeout(t);
    timer_is_on=0;
    }
    </script>
    </head>
    <body>

    <form>
    <input type="button" value="Start count!" onclick="doTimer()" />
    <input type="text" id="txt" />
    <input type="button" value="Stop count!" onclick="stopCount()" />
    </form>

    </body>
    </html>

  2. #2
    Join Date
    Jun 2012
    Location
    Dark Side of the Moon
    Posts
    70
    I have absolutely NO clue what you said you were trying to do, but your code works, it starts and stops with the functions. Here is code for it to alert on 15 secs, you can add another for 30 if you like, but if you want more help, please restate the question.

    Code:
    <html>
    <head>
    <script type="text/javascript">
    var c=0;
    var t;
    var timer_is_on=0;
    
    function timedCount()
    {
    document.getElementById('txt').value=c;
    c=c+1;
    
    if(c == 15){ alert("We have reached: " + c); }
    
    t=setTimeout("timedCount()",1000);
    }
    
    function doTimer()
    {
    if (!timer_is_on)
    {
    timer_is_on=1;
    timedCount();
    }
    }
    
    function stopCount()
    {
    clearTimeout(t);
    timer_is_on=0;
    }
    </script>
    </head>
    <body>
    
    <form>
    <input type="button" value="Start count!" onclick="doTimer()" />
    <input type="text" id="txt" />
    <input type="button" value="Stop count!" onclick="stopCount()" />
    </form>
    
    </body>
    </html>

  3. #3
    Join Date
    Jul 2012
    Location
    Stockport, Manchester, United Kingdom
    Posts
    11
    only thing missing from this is
    Code:
    <body onload="doTimer()">

  4. #4
    Join Date
    Sep 2011
    Location
    Bristol, England, United Kingdom
    Posts
    192
    You're better off using setInterval. It works the same way as setTimeout, but executes continuously until you call clearInterval; removing the recursive function calling you have going on. I've taken the liberty of rewriting your code. It works as you described. If you want to alert a value counting the number of resets, just add some form of counter to the code.

    Code:
    <!DOCTYPE html>
    
    <html>
    <head>
    
    </head>
    <body>
    
    <form>
    <input type="button" value="Start count!" id="start_timer" />
    <input type="text" id="txt" value="0" />
    <input type="button" value="Stop count!"  id="stop_timer" />
    </form>
    
    </body>
    </html>
    
    
    <script type="text/javascript">
    
    window.addEventListener("load", begin_time, false);
    document.getElementById("start_timer").addEventListener("click", restart_time, false);
    document.getElementById("stop_timer").addEventListener("click", stop_time, false);
    
    var time = 0;
    
    function begin_time()
    {
    	time = setInterval("count()", 1000);
    }
    
    function count()
    {
    	document.getElementById("txt").value++;	
    	
    	if(document.getElementById("txt").value == 31)
    	{
    		document.getElementById("txt").value = 0;
    		alert("something...");
    	}
    }
    
    function restart_time()
    {
    	begin_time();
    }
    
    function stop_time()
    {
    	clearInterval(time);
    	document.getElementById("txt").value = 0;
    }
    
    </script>
    Last edited by George88; 07-22-2012 at 05:09 PM.

Thread Information

Users Browsing this Thread

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

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