zoukankan      html  css  js  c++  java
  • 通过扫二维码,进到网页之后,判断设备,跳转不同网页。 window.navigator.userAgent用来区分设备和浏览器

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <meta name="viewport" content="viewport-fit=cover,width=device-width,height=device-height,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
      <title>个人所得税</title>
      <link rel="shortcut icon" href=/zrr/images/favicon.ico type=image/x-icon>
      <style>
        .download-layout{
           100%;
          height: 80vh;
          background-size: contain;
          background-position-x: center;
          background-repeat: no-repeat;
          background-image: url('./375_667.png');
        }
        .device-tips {
          display: none;
          position: fixed;
          top: 0;
          left: 0;
          background-color: #fff9e1;
          color: #f90;
          padding: 8px 16px;
          font-size: 14px;
          line-height: 20px;
        }
        .download-btn {
          text-decoration: none;
          display: block;
          height: auto;
           78%;
          border-radius: 4px;
          padding: 8px 12px;
          margin: 0 auto;
          font-size: 17px;
          line-height: 23px;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
          -webkit-user-select: none;
          background-color: #4285f4;
          color: #fff;
          text-align: center;
        }
      </style>
      <script>
        var IOS_REG_EXP = /iPhone/;
        // 需配置
        var IPA_DOWNLOAD_URL = 'https://itunes.apple.com/cn/app/个人所得税/id1436002627?l=zh&ls=1&mt=8';
        var ANDROID_REG_EXP = /Android/;
        // 需配置
        var APK_DOWNLOAD_URL = '/download/its.apk';
        // wechat
        var WECHAT_CLIENT_EXP = /MicroMessenger/;
        // alpay
        var ALIPAY_CLIENT_EXP = /AlipayClient/;
        
        
        setTimeout(function() {
          var ua = window.navigator.userAgent;
          if (ANDROID_REG_EXP.test(ua) && (WECHAT_CLIENT_EXP.test(ua) || ALIPAY_CLIENT_EXP.test(ua))) {
            document.querySelector('.J_DeviceTips').style.cssText = 'display: block;'
          }
        }, 300);
        
        function redirectDownload() {
          var ua = window.navigator.userAgent;
          // console.log(ua);
          var url = '';
          if (IOS_REG_EXP.test(ua)) {
            url = IPA_DOWNLOAD_URL;
          }
          if (ANDROID_REG_EXP.test(ua)) {
            url = APK_DOWNLOAD_URL;
          }
          if (url) {
            window.location.href = url;
          }
        }
      </script>
    </head>
    <body>
      <div class="download-layout"></div>
      <div class="device-tips J_DeviceTips">请点击右上角“…”选择在浏览器中打开本页面;或直接使用手机浏览器扫码下载。</div>
      <a href="javascript:;" class="download-btn" onclick="redirectDownload()">下载个人所得税</a>
    </body>
    </html>
    
  • 相关阅读:
    Netty指定分隔的字符
    Netty解决TCP粘包/拆包问题
    TCP粘包/拆包问题
    Netty5-应答服务器
    线程池中的线程的排序问题
    Java NIO 概述
    在windows中,如何使用cmd命令行窗口正确显示编码为utf-8格式的文字
    OXM
    Mysql event时间触发器,实现定时修改某些符合某一条件的某一字段
    linux 环境 tomcat 莫名奇妙挂掉
  • 原文地址:https://www.cnblogs.com/code-Officer/p/11982906.html
Copyright © 2011-2022 走看看