在 Internet Explorer 中阻止我的网站运行

Question

我不想让任何人在 Internet Explorer 中运行我的网站，所以我在我网站的第一个 .js 文件的开头添加了以下 JavaScript 调用，即文件名为 screen.js

screen.js

"use strict";

// block Internet Explorer as soon as possible
(function () {
    var isIE = /Trident|MSIE/.test(navigator.userAgent);
    if (isIE) {
        $('#blockIeModal').modal({ // <-- this is a modal that informs user that IE is not supported
            backdrop: 'static',
            keyboard: false
        });
    }
})()

我的包中有以下 .js 文件（ASP.NET MVC 语法）：

bundles.Add(new ScriptBundle("~/bundles/app").Include(
    "~/Scripts/app/screen.js",
    "~/Scripts/app/common.js",
    "~/Scripts/app/url-builder.js",
    "~/Scripts/app/dropdown-common.js",
    "~/Scripts/app/bootstrap-table-common.js",
    "~/Scripts/app/numeric-format.js",
    "~/Scripts/app/megamenu-builder.js"));

上面的代码运行在 Chrome 中很好，但 IE 不喜欢我在 .js 文件中使用的一些语法，例如在下面的屏幕截图中 IE 抱怨说common.js 的 行 96 存在语法错误：

并且由于这个错误，我没有得到应该在之前的调用中显示的阻止 IE 弹出窗口...我很困惑，因为我虽然在第一步就阻止了 IE...所以不明白为什么会显示这些语法错误？

更新

我尝试了@Nick Olay建议的方法，看下面的截图，它仍然显示了不应该在IE中显示的加载点...

Answer 1

尝试通过HTML

完成

<body>
<!--[if IE]>
  <p>Internet Explorer is not supported<p>
<![endif]-->

<![if !IE]>
  <p>Welcome</p>
<![endif]>
</body>

Answer 2

这是我在上面评论中概述的原则的 demonstration。

你可以看到我们默认 main-app div 为 display:none;

然后我们使用不会在 IE 中运行的代码向容器添加 class，在这种情况下我使用 div 来切换。

const showApp = (cssToUse = "show") => {
  document.querySelector(".dummy-body").classList.add(cssToUse);
};

showApp("show");

.main-app {
  display: none;
}

.warning {
  display: block;
}

.show .main-app {
  display: block;
}

.show .warning {
  display: none;
}

<div class="dummy-body">
  <div class="main-app">
      <p>This is the app</p>
  </div>
  <div class="warning">
      <p>Site does not run in this browser</p>
  </div>
</div>

Answer 3

感谢@epascarello 的评论，我设法通过在服务器端检测浏览器来解决问题，这是我所做的：

用于检测 IE 的服务器端函数：

public static class BrowserHelper
{
    public static bool IsInternetExplorer()
    {
        var userAgent = HttpContext.Current.Request.UserAgent;
        if (userAgent.Contains("MSIE") || userAgent.Contains("Trident"))
        {
            return true;
        }
        else
        {
            return false;
        }
    }
}

然后我根据上面的函数调用构建 HTML 页面：

<body>
    @if (BrowserHelper.IsInternetExplorer())
    {
        <P>IE is an out dated browser...</p>
    }
    else
    {
         <!-- Actual Page HTML -->
    }
</body>

Answer 4

这是我的做法。我让页面加载，但如果用户单击任何内容或尝试执行任何类型的按键，这些操作将不起作用，并且会通过提示切换来骚扰他们。不需要 HTML 更新。

function disableIE() {

    function isIE() {
        var ua = navigator.userAgent;
        return (ua.indexOf('MSIE') > -1 || ua.indexOf('Trident') > -1) && !window.chrome;
    };

    if(isIE()){
        alert('This window does not support Internet Explorer, and basic functions on this screen will not work properly. Please switch to a modern browser.')
        document.addEventListener("click", function(e){
            e.stopPropagation();
            e.preventDefault();
            alert("IE not allowed. Please use a modern browser.");
        }, true);
        document.addEventListener("keydown", function(e){
            e.stopPropagation();
            e.preventDefault();
            alert("IE not allowed. Please use a modern browser.");
        }, true);
    }
}

在 Internet Explorer 中阻止我的网站运行

Prevent my website from running in Internet Explorer

javascript

asp.net-mvc

internet-explorer

更新

在 Internet Explorer 中阻止我的网站 运行

Prevent my website from running in Internet Explorer

javascript

asp.net-mvc

internet-explorer

更新

在 Internet Explorer 中阻止我的网站运行