JavaScript electronic watch

zhaozj2021-02-17  74

An electronic meter will be implemented in this example with JavaScript. It is dynamic. The trick is the constructor of the time object and the call to the setTimeout, Cleartimeout method. The following is a list of programs that implement dynamic display of electronic meter, you can copy it to Notepad, save you * .html. In such a long program, the most critical thing is setTimeout ("Time ()", 1000), which calls a TIME function every 1 second (equal to 1000 milliseconds), the Time function controls the text. Browse this hypertext, will Will see every other second, the content in the time frame changes, just like an electronic watch.

Dynamic Display Time </ Title> <script language = "javascript"></p> <p>File: // Used to display the information function info () {Alert ("This is an electronic watch implemented with JavaScript.");} var timeid = null; var Timerrunning = false;</p> <p>File: // Start the electronic table Function startclock () {stopclock (); time ();</p> <p>File: // Stop running electronic table function stopclockclockclock () {if (time (time (time (time "; Timerrunning = false;}</p> <p>File: // Implementation Module Function Time () {File: // Create Time Objects VAR NOW = NOW.GETYAR () using new operators (); var mname = now.getMonth () 1; var DNAME = now.getday () 1; var daynr = ((now.getdate () <10)? "0": "") now.getdate (); var ampm = (now.Gethours )> = 12)? "Afternoon": "AM" Var Hours = now.GETHOURS (); Hours = ((Hours> 12); var minutes = ((now.getminutes () <10 )? ": 0": ":") now.getminutes (); var seconds = ((now.getSeconds () <10)? ": 0": ":") now.getSeconds ();</p> <p>File: // Judgment Today is a few IF (DNAME == 1) day = "sunday"; if (DNAME == 1) day = "monday"; if (DNAME == 3) day = "tuesday"; IF DNAME == 4) Day = "Wednesday"; if (DNAME == 5) Day = "thursday"; if (DNAME == 6) Day = "friday"; if (DNAME == 7) day = "saturday";</p> <p>File: // Judgment month IF (MNAME == 1) Month = "Janauary"; if (MNAME == 2) Month = "February"; if (MNAME == 3) Month = "march"; if (MNAME == 4) Month = "APRIL"; if (MNAME == 5) Month = "May"; if (MNAME == 6) Month = "june"; if (MNAME == 7) Month = "july"; if (MNAME == 8) Month = "August"; if (MNAME == 9) Month = "september"; if (MNAME = 10) Month = "October"; if (MNAME = 11) Month = "November"; if (MName "; IF = 12) Month = "december"; var dayofweek = (" day " "); Document.Forms [0] .Elements [0] .value = dayofweek; var mon ,yyear = (" month "," daynr "," YR ""); Document.Forms [0] .Elements [1] .value = monthdayyear; var timevalue = (" Hours Minutes Seconds " ampm); Document.Forms [0]. Elements [2] .Value = TimeValue; Timerid = setTimeout ("Time ()", 1000); Timerrunning = true;} </ script> </ head> <body online = "startclock ()> <center> JavaScript Electronics Table </ center> <br> <center> <form> <table border = 3 width = 500></p> <p><TR> <TD align = "center"> <font color = 800000 size = 1> <strong> Today's week </ strong> </ font> <TD align = "center"> <input type = "text" Name = "local" size = 13 value = "weekday"> </ TR></p> <p><TR> <TD Align = "Center"> <font color = 800000 size = 1> <strong> Date </ strong> </ font> <TD align = "center"> <input type = "text" name = "local" size = 22 value = "Date"> </ tr> <tr> <td align = "center> <font color = 800000 size = 1> <strong> time </ strong> </ font> < TD align = "center"> <input type = "text" name = "local" size = 16 value = "time"> </ tr></p> <p></ table> <br> <Table Border = 0 WIDTN = 400></p> <p><TR> <TD Align = "Center"> <input type = "οnclick =" stop "οnclick =" stopclock ()> <TD align = "center"> <input type = "button" value = "Continue "οnclick =" startclock ()> <td align = "center"> <input type = "οnclick =" nclick = "info ()> <TD align =" center "> <input type =" RESET "value =" reset "> </ tr></p> <p></ table> <br> </ form> </ center> </ body> </ html></p></div><div class="text-center mt-3 text-grey"> 转载请注明原文地址:https://www.9cbs.com/read-30954.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>) </div><div></div></div></div><ul class="postlist list-unstyled"> </ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="30954" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved </div><div class="col text-right">Processed: <b>0.041</b>, SQL: <b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script> var debug = DEBUG = 0; var url_rewrite_on = 1; var url_path = './'; var forumarr = {"1":"Tech"}; var fid = 1; var uid = 0; var gid = 0; xn.options.water_image_url = 'view/img/water-small.png'; </script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script> var forum_url = 'list-1.html'; var safe_token = 'v4Xb7OohDfgHOjR2_2FX3Ru030coF3sNSas268u3_2Bdah902DK5lF1zIo0z5g57TfqU_2FleAhdPz2vbzhUZXMUQC0Q_3D_3D'; var body = $('body'); body.on('submit', '#form', function() { var jthis = $(this); var jsubmit = jthis.find('#submit'); jthis.reset(); jsubmit.button('loading'); var postdata = jthis.serializeObject(); $.xpost(jthis.attr('action'), postdata, function(code, message) { if(code == 0) { location.reload(); } else { $.alert(message); jsubmit.button('reset'); } }); return false; }); function resize_image() { var jmessagelist = $('div.message'); var first_width = jmessagelist.width(); jmessagelist.each(function() { var jdiv = $(this); var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width(); var jmessage_width = Math.min(jdiv.width(), maxwidth); jdiv.find('img, embed, iframe, video').each(function() { var jimg = $(this); var img_width = this.org_width; var img_height = this.org_height; if(!img_width) { var img_width = jimg.attr('width'); var img_height = jimg.attr('height'); this.org_width = img_width; this.org_height = img_height; } if(img_width > jmessage_width) { if(this.tagName == 'IMG') { jimg.width(jmessage_width); jimg.css('height', 'auto'); jimg.css('cursor', 'pointer'); jimg.on('click', function() { }); } else { jimg.width(jmessage_width); var height = (img_height / img_width) * jimg.width(); jimg.height(height); } } }); }); } function resize_table() { $('div.message').each(function() { var jdiv = $(this); jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>'); }); } $(function() { resize_image(); resize_table(); $(window).on('resize', resize_image); }); var jmessage = $('#message'); jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); }); jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); }); $('#nav li[data-active="fid-1"]').addClass('active'); </script>