1

我希望代码检查用户是否在 iOS 设备上，如果不是，则隐藏 HTML 输入类型“播放”按钮。

所以，在我的代码中，我确定我的 iOS 检查是否错误，隐藏“播放”按钮的代码，或两者兼而有之：

<!DOCTYPE html>
<html>    
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>                               

<script type="text/javascript">             
    var iOS = false,
    p = navigator.platform;

    if( p === 'iPad' || p === 'iPhone' || p === 'iPod' ) {
      iOS = true;
    }               
    if (iOS === false) {                    
      $("input").hide();
    }
</script>

<script type="text/javascript">
    function load() {
        var vid = document.getElementById('vid');
        vid.addEventListener('ended', function() {
          /*    alert('video ended'); */
          /*   vid.load(); */
        },false);
    }
</script>

<title>NEW ENTRY TEST</title>
</head>

<body>

<body onload="load();">

<video id="vid" src="http://awp.diaart.org/ali/test/movies/testmovie.mov" width="640" height="480" autoplay></video>
<br>
<input type="submit" value="Play" onclick="document.getElementById('vid').play();">

</body>

</body>

</html>

基本上我只想显示这个播放按钮，只有当用户在 iOS 设备上时。

我知道它不起作用，因为播放按钮仍显示在普通（非 iOS）计算机上。

很想听听任何人对此的想法。

4

2 回答 2

5

jsFiddle 示例在这里。

首先，它应该被包裹在一个$(document).ready：

$(document).ready(function(){  
  var iOS = false,
  p = navigator.platform;
  if( p === 'iPad' || p === 'iPhone' || p === 'iPod' ) {
     iOS = true;
  }
  if (iOS === false) {
     $("input[type=button]").hide();
  }
});

现在，您剩下的唯一潜在问题是使用navigator.platform的检查案例。

根据规范，navigator.platform返回以下值之一：“ Win32 ”、“ Linux i686 ”、“ MacPPC ”、“ MacIntel ”——它们都不匹配您的检查案例。

但是，互联网上的其他来源似乎表明它确实在各自的设备上返回了“iPhone”、“iPad”等。由于我没有这些设备之一，因此我无法测试该理论。但如果它没有按建议工作，还有其他记录在案的方法来检测 iPhone、iPad 和 iPod - 请参阅使用 jQuery 检测 iPad 用户？.

一旦你测试了一个检测所有三个 iOS 产品的解决方案，将它存储在你的p变量中，你的代码应该可以按照你的意愿运行。

旁注：

  1. 您应该只有一个<body>，并且可以将两个单独<script>的 ' 合并为一个。
  2. 你不需要两者<!DOCTYPE html>和<html>。删除<html>.
  3. <input>'s 应该用在<form>'s.
  4. 我还将输入的类型从 更改submit为button。
  5. 如前所述@better_use_mkstemp，在此用例中，我认为您不需要该autoplay属性<input>（尤其是因为您不希望它无论如何都可以在 iOS 设备上播放）。

更新的 HTML：

<body onload="load();">
 <video id="vid" src="http://awp.diaart.org/ali/test/movies/testmovie.mov" width="640" height="480" autoplay></video>
  <br>  
  <input type="button" value="Play" onclick="document.getElementById('vid').play();"> 
</body>
于 2013-06-04T22:07:06.903 回答
0

尝试取出 if (p =='iPad')语句，然后看看它是否隐藏它。如果是这样，这意味着它将平台作为 iOS 设备来读取。

于 2013-06-04T22:11:03.113 回答