Question

我的页面中有倒计时和视频。我想根据视频计时器在特定时间开始倒计时，并在视频暂停时暂停倒计时。这是我的实际代码：

$(document).ready(function() {
	
			document.getElementById('timer1').innerHTML = 7 + ":" + 55;
			startTimer();
			

            

            function startTimer() {
                var presentTime = document.getElementById('timer1').innerHTML;
                var timeArray = presentTime.split(/[:]+/);
                var m = timeArray[0];
                var s = checkSecond((timeArray[1] - 1));
                if (s == 59) {
                    m = m - 1
                }


                document.getElementById('timer1').innerHTML =
                    "0" + (m < 10 ? m-- : "") + ":" + s;
                setTimeout(startTimer, 1000);
            }

            function checkSecond(sec) {
                if (sec < 10 && sec >= 0) {
                    sec = "0" + sec
                }; // add zero in front of numbers < 10
                if (sec < 0) {
                    sec = "59"
                };
                return sec;
            }
        });

 var myVideo = document.getElementById("video1");

    function playPause() {
        if (myVideo.paused)
            myVideo.play();
        else
            myVideo.pause();
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<video id="video1">
<source src="myvideo.mp4" type="video/mp4">
</video>


<div class="inline_timer hidden" id="element_1" align="center">
   <h3><span id="timer1"></span><span> The MASSIVE Thyroid Secret Is Revealed...</span></h3>
        
</div>

任何人都可以帮我解决一下吗？

Answer 1

参考MSDN网站，我编写了以下代码，它适用于Edge，Chrome和Firefox！

    <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        <script>
        var video;
        var timer;
        var vLength=3*60+55; 
        $(document).ready(function() {
                    video=$("#video1");
                    timer=$("#timer1");
                    video.on("click",function (){
                                        if (this.paused)
                                            this.play();
                                        else
                                            this.pause();
                                    });
                    video.on("timeupdate",function()
                                        {

                                            vTime=this.currentTime.toFixed(0);
                                            vRemaining=(vLength - vTime);
                                            sec=vRemaining%60;
                                            min=(vRemaining-sec)/60;
                                            vRemaining=min+":"+sec;
                                            timer.text(vRemaining);
                                        }); 
                });
        </script>       
    </head>
    <body>
        <video id="video1" autoplay>
        <source src="myvideo.mp4" type="video/mp4">
        </video>
        <div class="inline_timer hidden" id="element_1" align="center">
        <h3><span id="timer1">3:55</span><span> The MASSIVE Thyroid Secret Is Revealed...</span></h3>

        </div>
    </body>
</html>

根据我的视频计时器在特定时间开始倒计时，并在视频暂停时暂停倒计时

1 个答案: