Question

根据用户操作系统，我想显示两个iframe中的一个。如果用户使用iOS，则显示一个，如果androind，则显示另一个。

<iframe id="e8e2c112-f7ce-4d21-96e7-59729619a527" src="https://www.vectary.com/viewer/v1/?model=e8e2c112-f7ce-4d21-96e7-59729619a527" frameborder="0" width="50%" height="480"></iframe>

Answer 1

您可以像这样检测Javascript中的userAgent。

<html>

<body>
  <div id="vectary"></div>
  <script>

    function getOs() {
      var userAgent = navigator.userAgent || navigator.vendor || window.opera;

      if (/android/i.test(userAgent)) {
        //Vectary iframe 1 - for Android
        return '<iframe id="e8e2c112-f7ce-4d21-96e7-59729619a527" src="https://www.vectary.com/viewer/v1/?model=e8e2c112-f7ce-4d21-96e7-59729619a527" frameborder="0" width="50%" height="480"></iframe>';
      }

      // iOS detection from: http://stackoverflow.com/a/9039885/177710
      if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
        //Vectary iframe 2 - for iOS
        return '<iframe id="e8e2c112-f7ce-4d21-96e7-59729619a527" src="https://www.vectary.com/viewer/v1/?model=e8e2c112-f7ce-4d21-96e7-59729619a527" frameborder="0" width="50%" height="480"></iframe>';
      }

      //Vectary iframe 3 - for all other cases
      return '<iframe id="e8e2c112-f7ce-4d21-96e7-59729619a527" src="https://www.vectary.com/viewer/v1/?model=e8e2c112-f7ce-4d21-96e7-59729619a527" frameborder="0" width="50%" height="480"></iframe>';
    }

    document.getElementById("vectary").innerHTML = getOs();

  </script>
</body>

</html>

iFrame根据用户操作系统使用

1 个答案: