HTML, JavaScript And CSS Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
 
 
User Name:
Password:
Remember me
Go Back   ASP Free Forums > Programming > HTML, JavaScript And CSS Help
Reload this Page

Out putting time and date using JavaScript.

Discuss Out putting time and date using JavaScript. in the HTML, JavaScript And CSS Help forum on ASP Free.
Out putting time and date using JavaScript. HTML Help forum discussing HTML, DHTML, XHTML, and JavaScript languages for web development, including CSS style sheet coding. All aspects of website development are covered here.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread ASP Free Forums Sponsor:
  #1  
Old August 9th, 2004, 10:16 AM
szms szms is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 44 szms User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Out putting time and date using JavaScript.
I am using the following code for printing the date and time in the web site. But I would like to keep this code in a exterenal file and call it in side the html code for showing date and time. How to do that?


<SCRIPT LANGUAGE="JavaScript">
<!--
Stamp = new Date();
document.write('<B>Todays date:</b> ' '' + (Stamp.getMonth() + 1) +"/"+Stamp.getDate()+ "/"+Stamp.getYear() + ' <br> ');
var Hours;
var Mins;
var Time;
Hours = Stamp.getHours();
if (Hours >= 12) {
Time = " P.M.";
}
else {
Time = " A.M.";
}

if (Hours > 12) {
Hours -= 12;
}

if (Hours == 0) {
Hours = 12;
}

Mins = Stamp.getMinutes();

if (Mins < 10) {
Mins = "0" + Mins;
}

document.write('<B>Todays Time:</b> ' + Hours + ":" + Mins + Time + '');

//-->
</SCRIPT>
Reply With Quote
  #2  
Old August 9th, 2004, 11:45 AM
coinhunter's Avatar
coinhunter coinhunter is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: May 2004
Location: Battle Creek, Michigan
Posts: 352 coinhunter User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 30 sec
Reputation Power: 5
Send a message via Yahoo to coinhunter
Put the following in your HTML where you want the date & time to show up.
Code:
  <SCRIPT TYPE="text/javascript" src=timestamp.js></SCRIPT>

where timestamp.js is the name of your script with a .js extension.

Now your script should look like the following inside timestamp.js:
Quote:
Stamp = new Date();
document.write('<B>Todays date:</b> ' + (Stamp.getMonth() + 1) +"/"+Stamp.getDate()+ "/"+Stamp.getYear()+ '<br>');
var Hours;
var Mins;
var Time;
Hours = Stamp.getHours();
if (Hours >= 12) {
Time = " P.M.";
}
else {
Time = " A.M.";
}

if (Hours > 12) {
Hours -= 12;
}

if (Hours == 0) {
Hours = 12;
}

Mins = Stamp.getMinutes();

if (Mins < 10) {
Mins = "0" + Mins;
}

document.write('<B>Todays Time:</b> ' + Hours + ":" + Mins + Time + '');
NOTE: I tested your code and there was an error on the 1st document.write line, which I fixed and is reflected in the above code.
Good luck!
--------------------------------------------------------------------------------
Cast your vote in this form validation poll: http://forums.aspfree.com/t34569/s.html
Reply With Quote
  #3  
Old August 9th, 2004, 12:21 PM
szms szms is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 44 szms User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Hi coinhunter,

Thank you for your suggestion. I would like to keep the code inside the function. So that I would like to call the function. How to do it.?
Reply With Quote
  #4  
Old August 9th, 2004, 01:59 PM
coinhunter's Avatar
coinhunter coinhunter is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: May 2004
Location: Battle Creek, Michigan
Posts: 352 coinhunter User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 30 sec
Reputation Power: 5
Send a message via Yahoo to coinhunter
Okay.
The file with the function, timestamp.js should look exactly like the following code. There should be no <script> tags in it.
Quote:
function timestamp()
{
Stamp = new Date();
document.write('<B>Todays date:</b> ' + (Stamp.getMonth() + 1) +"/"+Stamp.getDate()+ "/"+Stamp.getYear()+ '<br>');
var Hours;
var Mins;
var Time;
Hours = Stamp.getHours();
if (Hours >= 12) {
Time = " P.M.";
}
else {
Time = " A.M.";
}

if (Hours > 12) {
Hours -= 12;
}

if (Hours == 0) {
Hours = 12;
}

Mins = Stamp.getMinutes();

if (Mins < 10) {
Mins = "0" + Mins;
}

document.write('<B>Todays Time:</b> ' + Hours + ":" + Mins + Time + '');
}

Then inside of your HTML pages put the following code inside your <HEAD> tags.
Quote:
<SCRIPT TYPE="text/javascript" src=testdate.js></SCRIPT>

Then where ever you want to call your function, do this:
Quote:
<SCRIPT>timestamp();</SCRIPT>
Reply With Quote
  #5  
Old August 10th, 2004, 09:00 AM
szms szms is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: Sep 2003
Posts: 44 szms User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 6
Now working with a new code for showing date and time. It works perfectly when JS code in under the html tag. But I would like to keep the JS code in an external file and call the file inside the html. I tired to do so but it's giving me error and the blinker is not blinking when I tried. Any suggestion. Thank you.


Code:
<HTML>
<HEAD>
<title>DCScript© Digital Clock</title>
<style>
.clock {
background-color: #A6A98D;
color: black;
font-family: verdana;
float: center;
border: 1px solid black;
border-collapse: collapse;
}
.time {
font-size: 100;
}
.clock TD {
border: 1px solid black;
border-collapse: collapse;
}
B {color:black}
BODY {font-family: arial; font-size: 10pt}
</style>
<SCRIPT LANGUAGE="JavaScript">
function time() {
var today = new Date();
var hrs = today.getHours();
var min = today.getMinutes();
var secs = today.getSeconds();
var alsohrs = today.getHours();
var dayNumber = today.getDate();
var year = today.getFullYear();
var ampm="";
var zero="0";
var month = today.getMonth() +1;
var weekday = today.getDay();
var wdn = new Array(7)
wdn[0] = "SUN";
wdn[1] = "MON";
wdn[2] = "TUE";
wdn[3] = "WED";
wdn[4] = "THU";
wdn[5] = "FRI";
wdn[6] = "SAT";
//Statement that puts '0's in front of single minutes or seconds.
if (min<10)
{
min=zero+min;
}
if (secs<10)
{
secs=zero+secs;
}
//Statement that eliminates Metric Time
if (hrs>12)
{
hrs=eval(hrs - 12);
}
if (hrs>=0 && hrs<1)
{
hrs=12
}
//P.M. Statement
if (alsohrs>=12 && alsohrs<24)
{
ampm="P.M.";
}
//A.M. Statement
if (alsohrs<12 && alsohrs>=0)
{
ampm="A.M.";
}
tmp='<table width="60%" class="clock"><tr><td class="time" colspan="4">';
tmp+=hrs+'<span id="blinker">:</span>'+min;
tmp+='<font size="20"> '+ampm+'</font>';
tmp+='<tr><td><font size="-1">Month</font><br><b>'+month+'</b></td>';
tmp+='<td><font size="-1">Date</font><br><b>'+dayNumber+'</b></td>';
tmp+='<td><font size="-1">Day</font><br><b>'+wdn[weekday]+'</b></td>';
tmp+='<td><font size="-1">Year</font><br><b>'+year+'</b></td></tr></table>';
document.getElementById("clockgoeshere").innerHTML=tmp;
clocktime=setTimeout("time()","1000");
}
function blink() {
var obj = document.getElementById("blinker");
if (obj.style.visibility == "visible") {
obj.style.visibility="hidden";
}
else {
obj.style.visibility="visible";
}
eachsecond=setTimeout("blink()","500");
}
</SCRIPT>
</head>
<body onLoad="time(); blink();"> <center>
<div id="clockgoeshere"></div><p>
</center>
</body>
</body>
</html>
Reply With Quote
  #6  
Old August 10th, 2004, 12:06 PM
coinhunter's Avatar
coinhunter coinhunter is offline
Contributing User
ASP Free Newbie (0 - 499 posts)
  
Join Date: May 2004
Location: Battle Creek, Michigan
Posts: 352 coinhunter User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 30 sec
Reputation Power: 5
Send a message via Yahoo to coinhunter
Once againt, not too hard to do.

Place this in your exteral file, clock.js:
Quote:
function time() {
var today = new Date();
var hrs = today.getHours();
var min = today.getMinutes();
var secs = today.getSeconds();
var alsohrs = today.getHours();
var dayNumber = today.getDate();
var year = today.getFullYear();
var ampm="";
var zero="0";
var month = today.getMonth() +1;
var weekday = today.getDay();
var wdn = new Array(7)
wdn[0] = "SUN";
wdn[1] = "MON";
wdn[2] = "TUE";
wdn[3] = "WED";
wdn[4] = "THU";
wdn[5] = "FRI";
wdn[6] = "SAT";
//Statement that puts '0's in front of single minutes or seconds.
if (min<10)
{
min=zero+min;
}
if (secs<10)
{
secs=zero+secs;
}
//Statement that eliminates Metric Time
if (hrs>12)
{
hrs=eval(hrs - 12);
}
if (hrs>=0 && hrs<1)
{
hrs=12
}
//P.M. Statement
if (alsohrs>=12 && alsohrs<24)
{
ampm="P.M.";
}
//A.M. Statement
if (alsohrs<12 && alsohrs>=0)
{
ampm="A.M.";
}
tmp='<table width="60%" class="clock"><tr><td class="time" colspan="4">';
tmp+=hrs+'<span id="blinker">:</span>'+min;
tmp+='<font size="20"> '+ampm+'</font>';
tmp+='<tr><td><font size="-1">Month</font><br><b>'+month+'</b></td>';
tmp+='<td><font size="-1">Date</font><br><b>'+dayNumber+'</b></td>';
tmp+='<td><font size="-1">Day</font><br><b>'+wdn[weekday]+'</b></td>';
tmp+='<td><font size="-1">Year</font><br><b>'+year+'</b></td></tr></table>';
document.getElementById("clockgoeshere").innerHTML=tmp;
clocktime=setTimeout("time()","1000");
}
function blink() {
var obj = document.getElementById("blinker");
if (obj.style.visibility == "visible") {
obj.style.visibility="hidden";
}
else {
obj.style.visibility="visible";
}
eachsecond=setTimeout("blink()","500");
}
Here is the regular HTML page:
Quote:
<HTML>
<HEAD>
<title>DCScript© Digital Clock</title>
<style>
.clock {
background-color: #A6A98D;
color: black;
font-family: verdana;
float: center;
border: 1px solid black;
border-collapse: collapse;
}
.time {
font-size: 100;
}
.clock TD {
border: 1px solid black;
border-collapse: collapse;
}
B {color:black}
BODY {font-family: arial; font-size: 10pt}
</style>
<SCRIPT TYPE="text/javascript" src=clock.js></SCRIPT>
</HEAD>
<body onLoad="time(); blink();"> <center>
<div id="clockgoeshere"></div><p>
</center>
</body>
</body>
</html>
Good Luck!
Reply With Quote
Reply

Viewing: ASP Free Forums > Programming > HTML, JavaScript And CSS Help > Out putting time and date using JavaScript.

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 3 hosted by Hostway. 
Stay green...Green IT