Question

好的 - 首先让我说我不是网络开发人员，而且我对HTML做的很少，而且javascript一点都没有，而且我的开发活动都很小，因为它不是我的工作但副作用。我的任务是接管我教会的网站，其中一个要求是嵌入视频，并有一个选择器来选择播放哪个视频。例如，当页面加载时，我会让它加载最新的视频，并在旁边或下方显示一个列表，其他视频可供选择。选择其中一个视频即可在同一个播放器中播放，无需访问YouTube。

我已经尝试了几件事情，但是我在网上找到了很多想法，所以这可能是不可能的，但如果是这样的话，我会感到惊讶。这是我尝试过的最新内容，只是为了让播放器加载一个辅助视频（我可以弄清楚如何在javascript中使用变量来处理多个视频）。说穿了，按钮似乎没什么作用。我很感激任何人都可以给我的建议。

＆＃13;

<!doctype html>
<html lang="en">
	<head>
		<title>
			Sample FPC Oakwood
		</title>
	</head>

        <div id="ytplayer"></div>

        <script>
            // Load the IFrame Player API code asynchronously.
            var tag = document.createElement('script');
            tag.src = "https://www.youtube.com/player_api";
            var firstScriptTag = document.getElementsByTagName('script')[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

            // Replace the 'ytplayer' element with an <iframe> and
            // YouTube player after the API code downloads.
            var player;
            function onYouTubePlayerAPIReady() {
                player = new YT.Player('ytplayer', {
                    height: '390',
                    width: '640',
                    videoId: 'RYDpE0SgXOw'
                });
            }

            function onYouTubePlayerSelectOther() {
                player = new YT.Player('ytplayer', {
                    height: '390',
                    width: '640',
                    videoId: '1HsmP-Gk7c4'
                });
            }
        </script>
        <input id="submit" type="button" value="Sis Bernardini" onclick="onYouTubePlayerSelectOther();"/>
</body>
</html>

＆＃13;

感谢您的帮助。

Answer 1

这样的事情怎么样？

HTML：

<iframe id="youtube" width="560" height="315" src="https://www.youtube.com/embed/RYDpE0SgXOw" frameborder="0" allowfullscreen></iframe>
<button onclick="changeVideo('1HsmP-Gk7c4');">Change Video</button>

JS：

function changeVideo(videoId) {
    var ytString = "https://www.youtube.com/embed/" + videoId;
    document.getElementById('youtube').src = ytString;
}

使用列表中选择的视频嵌入YouTube

1 个答案: