我有一個(gè)帶有視頻元素的 HTML，沒(méi)有控件和一個(gè)用于播放視頻的按鈕。 但是當(dāng)我嘗試使用按鈕播放視頻時(shí)，它沒(méi)有執(zhí)行任何操作。
我在控制臺(tái)中沒(méi)有收到任何錯(cuò)誤，并且視頻無(wú)法播放。
我無(wú)法弄清楚可能出了什么問(wèn)題。
當(dāng)我在視頻標(biāo)簽中添加控件屬性時(shí)，視頻可以完美播放，但我的目標(biāo)是不使用瀏覽器控件并構(gòu)建自己的控件。
這是我的代碼示例。我在這里使用了這個(gè)隨機(jī)視頻，以便來(lái)源有效。
我希望有人能幫幫忙。提前致謝。
const video = document.querySelector('video');
const playButton = document.querySelector('button');
playButton.addEventListener('click', video.play);
<video> <source src="https://mdn.github.io/learning-area/javascript/apis/video-audio/finished/video/sintel-short.mp4" type="video/mp4"></video> <button>Play</button>
2
0
0
將 eventListener 的 listener 更改為：
playButton.addEventListener("click", () => video.play());
代碼的問(wèn)題在于，當(dāng) video.play 方法作為事件偵聽(tīng)器函數(shù)提供時(shí)，它會(huì)丟失上下文并失敗?？梢酝ㄟ^(guò)將該方法封裝在匿名函數(shù)中來(lái)解決該問(wèn)題。 請(qǐng)檢查下面的 playButton.addEventListener(){...} 函數(shù)：
const video = document.querySelector('video');
const playButton = document.querySelector('button');
playButton.addEventListener('click', function() {
video.play();
});
