JS实现动态显示当前时间

效果图：

代码实现：

 <script language="JavaScript">
                    var timerID = null;
                    var timerRunning = false;
                    function stopclock() {
                        if (timerRunning)
                            clearTimeout(timerID);
                        timerRunning = false;
                    }
                    function startclock() {
                        stopclock();
                        showtime();
                    }
                    function showtime() {
                        var now = new Date();
                        var year = now.getFullYear();
                        var month = now.getMonth() + 1;
                        var day = now.getDate();
                        var hours = now.getHours();
                        var minutes = now.getMinutes();
                        var seconds = now.getSeconds()
                        var timeValue = "系统时间: " + year + "-" + ((month >= 10) ? month : "0" + month) + "-" + ((day >= 10) ? day : "0" + day) + "  ";
                        
                        timeValue += ((hours < 10) ? "0":"")+hours
                        timeValue += ((minutes < 10) ? ":0" : ":") + minutes
                        timeValue += ((seconds < 10) ? ":0" : ":") + seconds
                        document.clock.thetime.value = timeValue;
                        timerID = setTimeout("showtime()", 1000);
                        timerRunning = true;
                    }

                </script>

<form name="clock" style="float:right;360px;padding-top:5px;">
    <span style="vertical-align: central;">
       <input name="thetime" size="30" style="font-size: 14px; background-color: transparent; border: 0; color: #49d1fe ; font-weight: 600; ">
    </span>
 </form>