如何将JavaScript函数转换为jQuery，以便在加载页面时使用倒计时计时器

How to convert JavaScript functions to jQuery for a countdown timer on load of a page

本文关键字：加载计时器倒计时 JavaScript 函数转换 jQuery 更新时间：2023-09-26

我有一个倒计时计时器的以下代码。我需要将JavaScript部分转换为jQuery。倒计时计时器在页面加载时开始。我该如何做到这一点，因为我必须在加载页面时加载diffTime函数。请帮帮我。提前感谢。

编辑:我得到的jquery调用不能访问**函数Tick() **从**函数CreateTimer() **。是否有任何库的** setTimeout() **在jQuery?据我所知，它是JS原生的。

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
    <script type="text/javascript">
        var Timer;
        var TotalSeconds;

        function CreateTimer(TimerID, Time) {
            Timer = document.getElementById(TimerID);
            TotalSeconds = Time;
            //UpdateTimer()
            window.setTimeout("Tick()", 1000);
        }
        function Tick() {
            if (TotalSeconds <= 0) {
                //alert("Time's up!")
                document.getElementById("timeMsg").innerHTML = "Market closed!! ";
                return;
            }
            TotalSeconds -= 1;
            UpdateTimer()
            window.setTimeout("Tick()", 1000);
        }
        function UpdateTimer() {
            var Seconds = TotalSeconds;
            var Days = Math.floor(Seconds / 86400);
            Seconds -= Days * 86400;
            var Hours = Math.floor(Seconds / 3600);
            Seconds -= Hours * (3600);
            var Minutes = Math.floor(Seconds / 60);
            Seconds -= Minutes * (60);

            var TimeStr = ((Days > 0) ? Days + " days " : "") + LeadingZero(Hours) + ":" + LeadingZero(Minutes) + ":" + LeadingZero(Seconds)

            Timer.innerHTML = TimeStr;
        }

        function LeadingZero(Time) {
            return (Time < 10) ? "0" + Time : + Time;
        }
        function diffTime(){
            var startTime = 10*60 + 30; //starting time in minute
            var lastTime = 16*60 + 30;  //ending time in minutes
            var thisTime = new Date();              // now
            var currentYear = thisTime.getFullYear();        
            var currentMonth = thisTime.getMonth();
            var currentDay = thisTime.getUTCDate();
            var currentHour = thisTime.getHours();
            var currentMinute = thisTime.getMinutes();
            var currentTime = currentHour*60 + currentMinute;   //current time in minute
            if(currentTime >= startTime && currentTime < lastTime){
                var endTime = new Date(currentYear,currentMonth,currentDay,16,30);  // 4:30pm           
                var diff = endTime.getTime() - thisTime.getTime();   // now
                var remainTime = diff / (1000);     // positive number of days
                remainTime = Math.ceil(remainTime);
                CreateTimer("timer", remainTime);

            }else{
                document.getElementById("timeMsg").innerHTML = "Market closed!! ";
                document.getElementById("timer").innerHTML = "00:00:00";
            }
        }
        window.onload = diffTime;
    </script>

</head>
<body>
    <div><span id="timeMsg">Elapsed time remain: </span><b><span id='timer'></span></b></div>

</body>

调用document.ready()中的函数

 $( document ).ready( function ()
    {
diffTime();
});

如果你想让它在整个(即。图片、对象等)页面已加载:

$(window).load(function() {}

否则你可以在HTML加载完成后启动计时器&DOM准备好了:

$(document).ready(function() {}