错误 #1 - Poster 属性

如果你在使用视频标签时包含 poster 属性，并且你。正在使用<source>标签，那么视频将无法在。iPad&使用 iOS 3 的 iPhone 上运行。.你会。看到一个损坏的播放按钮，或者根本没有播放按钮。特别是在 iPad 上，播放是不稳定的。有时它会。工作，有时它会不。工作。这在Video for Everybody 网站上有所记载。

错误 #2 - Head 中的 JavaScript

这是一个有趣的发现……如果你将 JavaScript 包含在页面的 head 部分，它将。破坏 iPad 上的播放（同样不稳定）。如果你将 JavaScript 移到页面底部，并且仍然包含样式表，iPad 将会正常工作，但 iPhone 3 将不。工作。我最初是在No.inc 博客上的一篇文章中读到这个问题的，后来在重新设计 VideoJS 网站时自己也遇到了。他们最初的解决方案是只为 iPad 将 JS 放在页面底部（真有趣）。

苹果。的 iOS4 似乎修复了 iPhone 上的这两个问题，但在 iOS4 普及到 iPad 上，并且全世界的人都升级他们的设备之前，我们不得不应对这个问题。

针对 iOS 3 的修复

这个问题似乎是某种竞态条件，导致设备出现故障。对我的这两个问题都有效的解决方案是直接将可播放的源添加到视频标签中，并告诉视频加载（全部通过 Javascript）。

我。我已将所有这些添加到 VideoJS 1.1.2 中了，但这里是。它的基本工作原理。

var video = document.getElementById("your_video");
var children = video.children;
for (var i=0,j=children.length; i<j; i++) {
  if (children[i].tagName.toUpperCase() == "SOURCE") {
    var canPlay = video.canPlayType(children[i].type);
    if(canPlay == "probably" || canPlay == "maybe") {
      video.src = children[i].src;
      video.load();
      break; // or return or whatever
    }
  }
}

因此，遍历源元素，找到兼容的那个，并将其。添加到视频的 src 中。然后触发视频的。load() 函数。

这似乎解决了这两个问题。这不会让海报在任何设备上显示。它只是让视频可以播放。有时你会。看到它闪烁一下控制界面，然后又回到大播放按钮。

欢迎提供任何反馈。

让我们。行动起来，苹果，把 iOS4 推送给所有人！