从JavaScript控制HTML视频元素 [英] Controlling HTML video element from JavaScript

问题描述

这是aspx页面的标记部分：

This is the mark-up part of an aspx page:

 <input type="text"  id="t1"   önblur="setTime()"/>
  <select name="hai" id="hai1" >
  <option value="0.5">0.5kbps</option>
  <option value="1.0">1.0kbps</option>
  <option value="1.5">1.5kbps</option>
  <option value="2.0">2.0kbps</option>
   </select>
   <button  onclick="bitrates()" >play</button>
  <br> 
  <video id="video1" width="420" controls="controls" src="video/ram.MP4">
  </video>
 

<script type="text/javascript">
    var myVideo = document.getElementById("video1");


    function playPause() {
        if (myVideo.paused)
            myVideo.play();

        else
            myVideo.pause();
    }

    function makeBig() {
        myVideo.width = 600;
    }

    function makeSmall() {
        myVideo.width = 320;
    }

    function makeNormal() {
        myVideo.width = 420;
    }
    function bitrates() {

        myVideo.playbackRate = document.getElementById("hai1").value;
    }

    function setTime() {

        myVideo.currentTime = document.getElementById("t1").value;
    }


   
</script> 

</body>
</html>

我无法按预期工作的问题，请帮助我......

The problem that I can't get it work as expected, please help me...

推荐答案

两件事......


1.你从不打电话给你的 playPause 函数，所以要玩你必须使用鼠标...



2.点击按钮不仅会运行比特率功能，还会回发到服务器端，并重置页面...



您可以像这样更改您的代码...

Two things...

1. you never call your playPause function, so to play you must use the mouse...

2. click on the button not only runs the bitrate function but also post-back to the server side, and that resets the page...

You may change your code like this...

<button onclick="bitrates(); return false;">play</button>

return false; 将停止回发...

这篇关于从JavaScript控制HTML视频元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！