菜鸟教程小白 发表于 2022-12-11 18:42:23

ios - play() onabort iphone safari


                                            <p><p>我有一个问题，我在两周内无法解决。我使用 jQuery ui Widgets 来呈现引导轮播。在那些轮播中，我渲染了高质量的视频。如果页面上有很多视频元素，标题中的视频会停止加载并引发 onAbort 事件。我的播放功能看起来像</p>

<pre><code>play: function() {            
      var widget = this;
      var videoElement = widget._getVideoElement();
         if(!widget.options.isMobile.iOS){
      videoElement.attr(&#39;autoplay&#39;, &#39;true&#39;);
      widget._getVideoElementNative().play();
      widget._setPlayIcon(&#39;stop&#39;);
      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(&#39;canplaythrough&#39;, onCanPlayVideo, false);
      widget._getVideoElementNative().addEventListener(&#39;load&#39;, onCanPlayVideo, false); //add load event as well to avoid errors, sometimes &#39;canplaythrough&#39; won&#39;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&#39;t work properly.
   }
   else
   {
       widget._getVideoElementNative().play();
   }
}
</code></pre>

<p>},</p>

<pre><code>   onCanPlayVideo: function(){
widget._getVideoElementNative().removeEventListener(&#39;canplaythrough&#39;, onCanPlay, false);
widget._getVideoElementNative().removeEventListener(&#39;load&#39;, onCanPlay, false);
//video is ready
widget._getPosterElement().hide();
widget._getVideoElementNative().play();
</code></pre>

<p>},</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>我解决了使用 jQuery 动态注入(inject)视频元素的问题。现在当页面加载时没有视频元素，但是当用户单击“播放”时，我创建特定元素并将其设置为播放。关注 <a href="https://stackoverflow.com/questions/19621932/my-website-loads-slow-because-of-too-many-embedded-videos" rel="noreferrer noopener nofollow">this answer</a> </p></p>
                                   
                                                <p style="font-size: 20px;">关于ios - play() onabort iphone safari，我们在Stack Overflow上找到一个类似的问题：
                                                        <a href="https://stackoverflow.com/questions/41826333/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/41826333/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: ios - play() onabort iphone safari