javascript 显示时间

最新推荐文章于 2024-01-26 17:20:03 发布

原创最新推荐文章于 2024-01-26 17:20:03 发布 · 1k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #时间

javascript 专栏收录该内容

43 篇文章

订阅专栏

本文介绍了一个使用ASP.NET和JavaScript实现的实时显示当前时间的应用案例。该应用通过客户端JavaScript定时更新时间，并在服务器端使用ASP.NET控件展示。具体实现了时间格式化，并通过setTimeout方法每秒更新一次时间。

<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>clock</title>
    <script language="javascript" type="text/javascript">
        var timerId=null;
        function StartClock() {
            ShowTime(); //显示时间
        }
        //时间格式设定
        function InitTime() {
            var time="";
            var now = new Date();//现在具体时间
            var year=now.getFullYear();//年份
            var month=now.getMonth()+1;//月份
            var day=now.getDay();//日期
            var hours=now.getHours();//小时
            var minutes=now.getMinutes();//分
            var seconds = now.getSeconds(); //秒
            //设置时间显示格式
            time+=year+"-";
            time+=((month<10)? "0": "")+month+"-";
            time+=((day<10)? "0": "")+day+" ";
            time+=(hours<12)? hours :hours-12+":";
            time+=((minutes<10)? "0" :"")+minutes+":";
            time+=((seconds<10)? "0" :"")+seconds;
            time+=(hours<12)?"AM" :"PM";
            return time;
        }
        //显示时间
        function ShowTime() {
            //设置好格式的时间显示
            //在客户端Label映射为span,TextBox映射为text
            document.getElementById("txtTimer").value = InitTime();//服务器控件TextBox
            document.getElementById("lblTimer").innerHTML= InitTime();//服务器控件Label
            document.getElementById("iTimer").value = InitTime();//客户端控件text
            document.getElementById("sTimer").innerHTML = InitTime(); //客户端控件span
            timerId = setTimeout("ShowTime()", 1000); //每1s调用一次ShowTime()         
        }
    </script>
</head>
<body onload="return StartClock()">
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtTimer" runat="server"/><br />
        <asp:Label ID="lblTimer" runat="server"/><br />
        <input id="iTimer" type="text" /><br />
        <span id="sTimer" /><br />
    </div>
    </form>
</body>
</html>