Toggle display of clock by a button using Jquery

We have seen how to display a real time clock in JavaScript in Part 1. Now we will try to manage the display of the clock by controlling it through a button using JQuery.

Here is the demo






Here is the code.

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("span").toggle();
});
});

function display_c(){
var refresh=1000; // Refresh rate in milli seconds
mytime=setTimeout('display_ct()',refresh)
}

function display_ct() {
var strcount
var x = new Date()
document.getElementById('ct').innerHTML = x;
tt=display_c();
}
</script>

</head>
<body onload=display_ct();>

<button>Clock</button><br>
<span id='ct' ></span>
</body>
</html>





More on JavaScript Date & Time

Post your comments , suggestion , error , requirements etc here .




We use cookies to improve your browsing experience. . Learn more
HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
©2000-2019 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer