Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Stuck on BAsic Javascript

    I am making a basic clock through javascript using setInterval. I can get the time to show up but it will not update, which I am sure means there is something wrong
    with setInterval. I am new to this, so any help to get me in the right direction would be appreciated. Here is what I have so far:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Time</title>



    <script type="text/javascript">
    /* <![CDATA[ */
    {

    var currentTime = new Date();
    var currentHours = currentTime.getHours();
    var currentMinutes = currentTime.getMinutes();
    var currentSeconds = currentTime.getSeconds();
    }



    function newTime(){
    if(currentMinutes < 10)
    currentMinutes = "0" + currentMinutes;
    if(currentSeconds < 10)
    currentSeconds = "0" + currentSeconds;
    if(currentHours > 12)
    currentHours = currentHours - 12;
    var curTime = currentHours + ":" + currentMinutes + ":" + currentSeconds;
    document.write(curTime);
    }
    /* ]]> */
    </script>
    </head>
    <body onload="currentTime; setInterval('newTime()',1000);">

    </body>
    </html>

  • #2
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    there's nothing wrong with your interval - the problem is that you only set currentTime once. There are a couple of ways to do it, the simplest being just to set currenttime every time you call the newtime function...

    Code:
    <body> 
    <div id="clock"></div>
    <script type="text/javascript">
    function newTime(){
    var currentTime = new Date();
    var currentHours = currentTime.getHours();
    var currentMinutes = currentTime.getMinutes();
    var currentSeconds = currentTime.getSeconds();
    
    if(currentMinutes < 10)
    currentMinutes = "0" + currentMinutes;
    if(currentSeconds < 10)
    currentSeconds = "0" + currentSeconds;
    if(currentHours > 12)
    currentHours = currentHours - 12;
    var curTime = currentHours + ":" + currentMinutes + ":" + currentSeconds;
    document.getElementById("clock").innerHTML=curTime;
    }
    newTime();
    setInterval(newTime,1000);
    </script>
    </body>

  • #3
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thank you for your response. I have tried this previously and when I do it like this, I can't get anything to show up on the screen.

  • #4
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,918
    Thanks
    56
    Thanked 545 Times in 542 Posts
    hmmm... if you had tried it like that it would have been working. Try pasting the entire code that I posted into your page. I think you will find that it works fine.

  • #5
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    7
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Thank you again. After copying your code it worked perfectly. I am obviously still learning and appreciate the time you took to resolve my problem!


  •  

    Posting Permissions

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