video标签的mp4格式的视频不能在iphone上播放问题

如下图：

//html代码
<div class="video_box">
    <div class="mask"></div>
    <div class="video">
      <video width="350" height="auto" controls="" autoplay="autoplay" playsinline="true">
        <source src="mp4/XXX.mp4" type="video/mp4">
        <source src="mp4/XXX.mp4" type="video/ogg">
        您的浏览器不支持 HTML5 video 标签 请切换浏览器。
      </video>
      <span class="close close_btn" data-name="video_box"></span>
    </div>
</div>

//js代码
  <script>
   $(".video video").load();
  </script>

video的基本属性：

    playsinline="true"全屏
　　preload: （预加载）iPhone支持，Android不一定支持;
　  poster: （封面图片）iPhone支持，Android不一定支持;
　　autoplay: （自动播放）iPhone中的[Safari]不支持，webview可能被开启。Android不一定支持；
　　loop: （循环播放）iPhone支持，Android不一定支持;
　　controls: （控制条）iPhone支持，需要开始播放了才显示，Android基本支持;
　　width: （宽度）;
　　height: （高度）;
有时候在微信网页端插入<Video>标签的时候,不希望用户来拖动进度条的话,可以直接使用 playsinline属性,webkit-playsinline属性
注：iPhone Safari 中播放视频只能全屏。

1.其实这是因为mp4的这种编码方式，iphone不支持，只需要用视频软件（我用格式化工厂）转一下编码方式就行，如图：

工具：# 格式工厂

下载地址：mydown.yesky.com/pcsoft/2659…

根据机型加载相应的视频文件（格式不同，avi或mp4） // IOS或Android

var u = navigator.userAgent;

var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端

var isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端

if (isiOS) {
	toastfun("您是IOS系统");
	return false;
} else if (isAndroid){
	toastfun("您是安卓系统");
}