我有一个问题,我在两周内无法解决。我使用 jQuery ui Widgets 来呈现引导轮播。在那些轮播中,我渲染了高质量的视频。如果页面上有很多视频元素,标题中的视频会停止加载并引发 onAbort 事件。我的播放功能看起来像
play: function() {
var widget = this;
var videoElement = widget._getVideoElement();
if(!widget.options.isMobile.iOS){
videoElement.attr('autoplay', 'true');
widget._getVideoElementNative().play();
widget._setPlayIcon('stop');
widget.options.isPlaying = true;
if (!widget.options.canPlay) {
widget._getLoadingIcon().show();
} else {
widget._getPosterElement().hide();
}
}
else{ //videoplay for iOS devices
widget._getVideoElementNative().currentTime = 0.1;
if(widget._getVideoElementNative().readyState !== 4){
widget._getVideoElementNative().addEventListener('canplaythrough', onCanPlayVideo, false);
widget._getVideoElementNative().addEventListener('load', onCanPlayVideo, false); //add load event as well to avoid errors, sometimes 'canplaythrough' won't dispatch.
setTimeout(function(){
widget._getVideoElementNative().pause(); //block play so it buffers before playing
}, 1); //it needs to be after a delay otherwise it doesn't work properly.
}
else
{
widget._getVideoElementNative().play();
}
}
},
onCanPlayVideo: function(){
widget._getVideoElementNative().removeEventListener('canplaythrough', onCanPlay, false);
widget._getVideoElementNative().removeEventListener('load', onCanPlay, false);
//video is ready
widget._getPosterElement().hide();
widget._getVideoElementNative().play();
},
Best Answer-推荐答案 strong>
我解决了使用 jQuery 动态注入(inject)视频元素的问题。现在当页面加载时没有视频元素,但是当用户单击“播放”时,我创建特定元素并将其设置为播放。关注 this answer
关于ios - play() onabort iphone safari,我们在Stack Overflow上找到一个类似的问题:
https://stackoverflow.com/questions/41826333/
|