我需要获取data-video-id属性,并且我的代码在请求时始终返回null。
<script src="https://www.youtube.com/iframe_api"></script>
<script src="js/video.js"></script>
<a data-target="#myModal" data-toggle="modal" data-video-id="VDB65S6rCC0" >
<div class="btn btn-success"> Open Modal 2</div>
</a>
<a id='video-player-1' href="#my_modal" data-toggle="modal" data-video-id="VDB65S6rCC0">Open Modal 1</a>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: '{{no-video-id}}',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
$('.open-popup').click(function() {
event.target.playVideo();
});
$('.close-popup').click(function(e) {
player.stopVideo();
});
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if(event.data === 0) {
$('.close.close-popup').click();
}
}
function stopVideo() {
player.stopVideo();
}
$(function () {
onYouTubeIframeAPIReady();
$('#my_modal').on('show.bs.modal', function(e) {
var videoId = $(e.relatedTarget).data('video-id');
var x = new String(videoId);
player.loadVideoById(x);
$("iframe[src^='https://www.youtube.com']").addClass("embed-responsive-item");
alert("BOOM!");
});
$('#video-player-1').click(function(e) {
var bookId = $(e.relatedTarget).data('video-id');
alert($(e.relatedTarget.nodeName));
var x = new String(bookId);
player.loadVideoById(x);
});
});
单击来打开模态时,相关目标为空。
TypeError:null不是对象(正在评估 'e.relatedTarget.nodeName')
alert(e);
返回
[对象对象]
$('#my_modal').on('show.bs.modal', function(e) {
似乎也没有执行。