第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全，請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題，去搜搜看，總會(huì)有你想問的

如何使視頻僅在單擊 javascript 中的按鈕時(shí)播放

如何使視頻僅在單擊 javascript 中的按鈕時(shí)播放

catspeake 2023-03-18 14:53:29
我有一個(gè) div，它里面有一個(gè)<video autoplay> <source src='myvid'> </video>，默認(rèn)情況下 divdisplay ='none'在 css 上有一個(gè)。我正在添加一個(gè)單擊 div 的事件偵聽器，一旦單擊它，我就會(huì)將不顯示更改為顯示塊。問題是視頻會(huì)在網(wǎng)站重新加載時(shí)自動(dòng)播放，而不是在單擊按鈕時(shí)自動(dòng)播放。基本上我希望視頻僅在 div 顯示 ='block' 時(shí)播放。我怎么能用 Javascript 做到這一點(diǎn)？
查看完整描述

2 回答

?
千萬里不及你

TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超9個(gè)贊

  • 刪除autoplay屬性

  • 使用 JavaScript 使用自定義按鈕和.play()方法播放視頻

<video?id="video">?<source?src='myvid'></video>
<button?id="play">PLAY</button>
document.querySelector("#play").addEventListener("click",?()?=>?{?
?document.querySelector("#video").play();
});

如果您不想要自定義按鈕（您的問題不清楚），則可以使用屬性提供瀏覽器默認(rèn)controls值

const EL_video = document.querySelector("#video");

const EL_play = document.querySelector("#play");


EL_play.addEventListener("click", () => {

? const isPaused = EL_video.paused;

? EL_video[isPaused ? "play" : "pause"]();

? EL_video.classList.toggle("u-none", !isPaused);

});

#video {width: 300px;}


/* Utility classes: */

.u-none {display: none;}

<button id="play">Toggle &amp; play</button><br>

<video id="video" class="u-none">

? <source src='http://vjs.zencdn.net/v/oceans.mp4' type='video/mp4'>

</video>


查看完整回答
反對(duì) 回復(fù) 2023-03-18
?
守著星空守著你

TA貢獻(xiàn)1799條經(jīng)驗(yàn) 獲得超8個(gè)贊

嘗試onclick向 div 添加一個(gè)屬性，如下所示：

<div onclick="play_video();">

或者您可以創(chuàng)建一個(gè)按鈕：

<button onclick="play_video();">play the video</button>

然后，像這樣創(chuàng)建 javascript 函數(shù)：

function play_video()
{  document.getElementById("id_of_the_video").play();
}


查看完整回答
反對(duì) 回復(fù) 2023-03-18
  • 2 回答
  • 0 關(guān)注
  • 173 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

 幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

 公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)