Javascript,我无法获得video.getCurrentTime()来显示运行的视频时间

时间:2013-03-20 15:40:55

标签: javascript html5

视频正在运行,另一个setInterval函数运行正常,但video.getCurrentTime()根本不显示在div id =“test”中。我希望每次视频运行时都能显示视频时间。我无法弄清楚为什么。这是我的示例代码,

<html>
<head>
<script>
setInterval(function(){

                    var t = document.getElementById('test');

                    video = document.getElementById('caption');

                    t.innerHTML = video.getCurrentTime();


            },1000);
</script>
</head>

    <body>

        <div>
            <video id="caption" width="320" height="240" controls>
                <source src="caption.mp4" type="video/mp4">
            </video> 
        </div>
        <div id="container">
        </div>
        <div id ="timer">
        </div>
        <div id = "test">   
        </div>
    </body>
</html>

2 个答案:

答案 0 :(得分:1)

这是一个工作版本:

<html>
<head>
</head>

<body>

    <div>
        <video id="caption" width="320" height="240" controls="">
            <source src="caption.mp4" type="video/mp4">
        </video> 
    </div>
    <div id="container">
    </div>
    <div id ="timer">
    </div>
    <div id="test">Hello   
    </div>
    <script>
        function displayTime(){
            var time = document.getElementById('test');

            var video = document.getElementById('caption');

            //time.innerHTML = video.currentTime;

            var text = "", cap = "";

                for( int i = 0; i < subtitleArray.length;i++)
                {
                    //var currentTime = video.currentTime();
                    var cueStart = parseFloat(subtitleArray[i][0]);
                    var cueEnd = cueStart + parseFloat(subtitleArray[i][1]);
                    //var diff = cueStart - currentTime;

                    cap = subtitleArray[i][2];

                    if (video.currentTime >= cueStart && video.currentTime <= cueEnd) {
                       text = cap.text;   
                    }
                }

                t.innerHTML = text; 
        }
        setInterval(displayTime,1000);
</script>
    </body>
</html>

答案 1 :(得分:0)

我认为这将是video.currentTime,而不是getCurrentTime 最好将脚本标记放在正文的末尾,或者你可以做$(document).ready(function(){ });在jquery