JS判断浏览器类型

1. 描述

有时 IE 系列浏览器对有些页面的支持度不够，我们需要根据用户的浏览器类型进行区分跳转页面，那么如何区分用户使用的浏览器呢？

我们可以通过浏览器的字头来判断，弹出框显示浏览器类型，效果如下：

2. 示例

新建一个工作簿，在 A1 单元格插入按钮控件，命名为按钮，添加点击事件：

1. function myBrowser() {
   
2.     const userAgent = navigator.userAgent.toLowerCase(); // 取得浏览器的userAgent字符串
   
3.     const isOpera = userAgent.indexOf('opera') > -1; // 判断是否Opera浏览器
   
4.     const isIE = userAgent.indexOf('compatible') > -1
   
5.         && userAgent.indexOf('msie') > -1 && !isOpera; // 判断是否IE浏览器
   
6.     const isEdge = userAgent.indexOf('edg') > -1; // 判断是否IE的Edge浏览器
   
7.     const isFForIE11 = userAgent.indexOf('gecko') > -1
   
8.         && userAgent.indexOf('chrome') === -1; // 判断是否Firefox浏览器
   
9.     const isSafari = userAgent.indexOf('safari') > -1
   
10.         && userAgent.indexOf('chrome') === -1; // 判断是否Safari浏览器
    
11.     const isChrome = userAgent.indexOf('chrome') > -1
    
12.         && userAgent.indexOf('safari') > -1; // 判断Chrome浏览器
    
13. 
    
14.     if (isIE) {
    
15.         const reIE = new RegExp('msie (\\d+\\.\\d+);');
    
16.         reIE.test(userAgent);
    
17.         const fIEVersion = parseFloat(RegExp.$1);
    
18.         if (fIEVersion == 7) {
    
19.             return 'ie7';
    
20.         } if (fIEVersion == 8) {
    
21.             return 'ie8';
    
22.         } if (fIEVersion == 9) {
    
23.             return 'ie9';
    
24.         } if (fIEVersion == 10) {
    
25.             return 'ie10';
    
26.         }
    
27.         return '0';
    
28.         // IE版本过低
    
29.         return 'IE';
    
30.     }
    
31.     if (isEdge) {
    
32.         return 'Edge';
    
33.     }
    
34.     if (isOpera) {
    
35.         return 'Opera';
    
36.     }
    
37.     if (isSafari) {
    
38.         return 'Safari';
    
39.     }
    
40.     if (isFForIE11) {
    
41.         if (userAgent.indexOf('net') > -1) {
    
42.             return 'IE11';
    
43.         }
    
44.         return 'FF';
    
45.     }
    
46.     if (isChrome) {
    
47.         return 'Chrome';
    
48.     }
    
49. }
    
50. alert(myBrowser());

复制代码

保存模板，点击填报预览，效果如描述中效果图所示。

3. 模板下载

点击下载模板：JS判断浏览器类型.cpt