H5 video标签我要做一个切换清晰度的按钮，请问如何解决

Question

<video id="myVideo" style="width:100%" controls="" preload="">
    <source src="video/echo-hereweare.mp4" type="video/mp4" codecs="avc1.42E01E,mp4a.40.2">
    <!--[if IE 8]>
        <embed src="video/echo-hereweare.mp4" style="width:100%" autostart="false"/>
    <![endif]--></video>

//切换视频清晰度function videoSourceChoose(){    var myVideo = document.getElementById("myVideo");    var url = myVideo.currentSrc;    var nums = url.length;    url = url.substring(0,nums-4)+"_small.mp4";    //视频地址
    
    var nowsTime = myVideo.currentTime;    //视频播放时间
    myVideo.load();
}

当点击按钮的时候调用此方法，切换为_small.mp4，别且从上次观看的时间继续播放。

Answer 1

<video&nbsp;id="myVideo"&nbsp;style="width:100%"&nbsp;controls=""&nbsp;preload=""> &nbsp;&nbsp;&nbsp;&nbsp;<source&nbsp;src="video/echo-hereweare.mp4"&nbsp;type="video/mp4"&nbsp;codecs="avc1.42E01E,mp4a.40.2"> &nbsp;&nbsp;&nbsp;&nbsp;<!--[if&nbsp;IE&nbsp;8]> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<embed&nbsp;src="video/echo-hereweare.mp4"&nbsp;style="width:100%"&nbsp;autostart="false"/> &nbsp;&nbsp;&nbsp;&nbsp;<![endif]--></video>//切换视频清晰度function&nbsp;videoSourceChoose(){&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;myVideo&nbsp;=&nbsp;document.getElementById("myVideo");&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;url&nbsp;=&nbsp;myVideo.currentSrc;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;nums&nbsp;=&nbsp;url.length;&nbsp;&nbsp;&nbsp;&nbsp;url&nbsp;=&nbsp;url.substring(0,nums-4)+"_small.mp4";&nbsp;&nbsp;&nbsp;&nbsp;//视频地址 &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;nowsTime&nbsp;=&nbsp;myVideo.currentTime;&nbsp;&nbsp;&nbsp;&nbsp;//视频播放时间 &nbsp;&nbsp;&nbsp;&nbsp;myVideo.load(); }当点击按钮的时候调用此方法，切换为_small.mp4，别且从上次观看的时间继续播放。

Answer 2

先不说做法合不合理，先说大致解法吧。点击切换-获取当前播放进度a-替换src-播放-跳转进度至a主流的做法是使用文件流blob代替MP4