亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

根據本地存儲中的值播放視頻

根據本地存儲中的值播放視頻

天涯盡頭無女友 2023-08-18 14:08:36
我知道這個問題可能已經在這里被問過幾次,但是我找不到我一直在尋找的解決方案。我們有一個要求,用戶應該能夠暫停視頻并從離開的地方恢復。我能夠達到能夠從本地存儲存儲和獲取暫停時間的程度,但是我一直面臨著從存儲值播放視頻的挑戰。下面是代碼。<video id="myVideo" width="300" height="300" controls>    <source src="Bunny.mp4" type="video/mp4">    Your browser does not support HTML5 video.</video><br /><button onclick="PlayVideo()" type="button" id="PlayVideo">Play</button><script>    var vid = document.getElementById("myVideo")    function getCurTime() {        return vid.currentTime    }    var isPlaying = false    var PausedTime    function PlayVideo() {        var change = document.getElementById("PlayVideo")        if (isPlaying) {            vid.pause()            //Storing the paused time to local storage            localStorage.setItem('CaptureTime', getCurTime())            //Get the saved time from local storage            PausedTime = localStorage.getItem('CaptureTime')            change.innerHTML = "Play"        }        else {            vid.play()            change.innerHTML = "Pause"        }        isPlaying = !isPlaying    }</script>如果這里有人能幫助我解決這個問題,我將不勝感激。如果需要更多詳細信息,請告訴我。
查看完整描述

2 回答

?
汪汪一只貓

TA貢獻1898條經驗 獲得超8個贊

您應該只在播放時獲取時間,并在暫停時保存。將當前時間設置為本地存儲播放時暫停的時間。像這樣:


var vid = document.getElementById("myVideo");


function getCurTime() { 

  return vid.currentTime;


var isPlaying = false;

var PausedTime;


function PlayVideo() {

    var change = document.getElementById("PlayVideo");

    //Get the saved time from local storage

    var PausedTime = localStorage.getItem('CaptureTime');

   

    if (isPlaying) {

      vid.pause();

    

      //Storing the paused time to local storage

      localStorage.setItem('CaptureTime', getCurTime());

      

      change.innerHTML = "Play"; 

    }


    else {

      vid.currentTime = PausedTime;

      vid.play();

      change.innerHTML = "Pause";  

    }

    

    isPlaying = !isPlaying;    


}

<video id="myVideo" width="300" height="300" controls>

  <source src="Bunny.mp4" type="video/mp4">

  Your browser does not support HTML5 video.

</video><br/>


<button onclick="PlayVideo()" type="button" id="PlayVideo">Play</button>


查看完整回答
反對 回復 2023-08-18
?
滄海一幻覺

TA貢獻1824條經驗 獲得超5個贊

要在 JavaScript 中暫停和播放視頻,您實際上不需要將時間保存到本地存儲。話雖這么說,如果你仍然想這樣做,你只需要記住這些行:


localStorage.setItem('CaptureTime', getCurTime());

PausedTime = localStorage.getItem('CaptureTime');

vid.currentTime = PausedTime;


另外,當我嘗試你的代碼時,它不會將播放更改為暫停,所以我做了一些調整。


這就是我實現這一切的方式:


<html>?

<body>?

? ? ? ??

? ? ? ? <button id="controls" onclick="play()" type="button">Play Video</button><br>?

? ? ? ??

? ? ? ? <video id="myVideo" width="320" height="176">

? ? ? ? ? <source src="Bunny.mp4" type="video/mp4">

? ? ? ? ? Your browser does not support HTML5 video.

? ? ? ? </video>

? ? ? ??

? ? <script>?

? ? ? ? var vid = document.getElementById("myVideo");?

? ? ? ? var isPlaying = false; //or this could be: var isPaused = vid.paused;

? ? ? ??

? ? ? ? function play() {?


? ? ? ? ? ? if(!isPlaying){

? ? ? ? ? ? ? ?vid.play();?

? ? ? ? ? ? ? ?document.getElementById("controls").innerHTML = "Pause Video";

? ? ? ? ? ? }

? ? ? ? ? ? else{

? ? ? ? ? ? ? ? vid.pause();?

? ? ? ? ? ? ? ? document.getElementById("controls").innerHTML = "Play Video";

? ? ? ? ? ? }

? ? ? ? ? ? isPlaying = !isPlaying;

? ? ? ? ?}?

? ? ?</script>?

? ??

? ? ? ??

?</body>?

?</html>


查看完整回答
反對 回復 2023-08-18
  • 2 回答
  • 0 關注
  • 158 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號