当开发人员工具打开IE11时,网站的行为会有所不同

Question

我在IE11中使用以下模板,无法弄清楚为什么每次导航发生时侧边栏都会唱歌.当开发人员工具打开时,它的行为与我希望的一样.通过在运行IE11时单击树中UI元素下的任何一个选项卡,可以轻松演示它.但是,您会注意到如果F12开发人员工具打开,每次导航发生时侧栏都不会滑动.这不是chrome中的问题.fastclick有一个错误,可能会显示但是我没有快速点击而且仍然会发生.任何帮助都会很棒.谢谢. https://almsaeedstudio.com/themes/AdminLTE/pages/UI/general.html

Answer 1

尝试console.log()从代码中删除任何内容.

console.log()调试Javascript时可以帮助IE完全停止处理页面上的脚本.为了增加这个谜团,如果你继续在开放式开发工具的IE中观看你的页面 - 你根本不会注意到一个问题.

说明

原因是除非在IE中打开devtools,否则不会实例化控制台对象.否则,您将看到两件事之一:

1. Javascript无法正确执行
2. 控制台有神秘的错误,例如"对象未定义"或其他具有此类性质的错误

十分之九,你的代码中有一个错误的console.log.这不会影响IE以外的任何浏览器.

Answer 2

另一个潜在的原因（尤其是在执行ajax调用的情况下）是在关闭开发工具时可能会缓存ajax响应，而在打开开发工具时会从服务器刷新ajax响应。

在IE中，打开“ 开发人员工具”的“ 网络”标签，单击播放图标，然后取消设置“ 始终从服务器刷新”按钮。然后观察是否有任何ajax调用返回，响应代码为304（未修改）。如果是这样，则您不会从服务器获取新数据，您需要在通过ajax调用的页面上更新可缓存性设置。

Answer 3

添加到已经很好的答案（因为我无法发表评论 - 需要 50 个代表点），同意@sam100rav 的答案和@storsoc 的评论，我发现在 IE11 版本11.1387.15063.0和更新版本11.0.90（KB4462949）中，window.console确实存在作为一个空对象 ( window.console = {})。因此，我使用了来自 @storsoc 的 polyfill 的变体，如下所示。

if (!window.console || Object.keys(window.console).length === 0) {
  window.console = {
    log: function() {},
    info: function() {},
    error: function() {},
    warn: function() {}
  };
}