一个时钟显示的JavaScript文档

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style type="text/css">
<style>
</style>
    <title>时钟</title>
    <script language="JavaScript">
        function showClock() {
        }
        function hideClock() {
        }
        var timerID = null
        var timerRunning = false
        function stopClock() {
            if (timerRunning)
                clearTimeout(timerID);
            timerRunning = false
            document.clock.face.value = "";
        }
        function showTime() {
            var now = new Date();
            var year = now.getYear();
            var month = now.getMonth() + 1;
            var date = now.getDate();
            var hours = now.getHours();
            var mins = now.getMinutes();
            var secs = now.getSeconds();
            var timeVal = "";
            timeVal += ((hours <= 12) ? hours : hours - 12);
            timeVal += ((mins < 10) ? ":0" : ":") + mins;
            timeVal += ((secs <= 10) ? ":0" : ":") + secs;
            timeVal += ((hours < 12) ? "AM" : "PM");
            timeVal += ((month < 10) ? " on 0" : " on ") + month + "-";
            timeVal += date + "-" + year;
            document.clock.face.value = timeVal;
            timerID = setTimeout("showTime()", 1000);
            timerRunning = true
        }
        function startClock() {
            stopClock();
            showTime();
        }
        function windowOpener(indexnum) {
            var loadpos = "date.html" + "#" + indexnum;
            controlWindow = window.open(loadpos, "date", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=620,height=400");
        }
    </script>
</head>
<body onload="startClock()">
    <p align="center">
    </p>
    <div align="center">
        <center>
            <table border="0" cellspacing="0" cellpadding="0">
                <tr>
                    <td width="100%">
                        <form name="clock" onsubmit="0">
                        <div align="center">
                            <center>
                                <p>
                                    <input type="text" name="face" size="20" value style="background-color: rgb(192,192,192)">
                                </p>
                            </center>
                        </div>
                        </form>
                    </td>
                </tr>
            </table>
        </center>
    </div>
</body>
</html>

 

显示的效果是：（此为静态效果）

posted on 2013-01-22 13:37  程序小民工  阅读(150)  评论(0)    收藏  举报

导航