为什么 JavaScript 只在 IE 中打开开发人员工具一次后才能工作?

IT技术 javascript internet-explorer internet-explorer-9
2021-01-13 16:31:03

IE9 错误 - JavaScript 只有在打开开发人员工具一次后才能工作。

我们的网站为用户提供免费的pdf下载,并有简单的“输入密码下载”功能。但是,它在 Internet Explorer 中根本不起作用。

您可以在此示例中亲自查看

下载通行证是“makeuseof”。在任何其他浏览器中,它都可以正常工作。在 IE 中,两个按钮什么都不做。

我发现的最奇怪的事情是,如果您使用 F12 打开和关闭开发人员工具栏,它会突然开始工作。

我们已经尝试过兼容模式等,没有任何区别。

如何在 Internet Explorer 中实现此功能?

6个回答

听起来您的 javascript 中可能有一些调试代码。

您所描述的体验是包含console.log()或任何其他console功能的代码的典型体验

console对象仅在打开开发工具栏时激活。在此之前,调用控制台对象将导致它被报告为undefined. 打开工具栏后,控制台将存在(即使工具栏随后关闭),因此您的控制台调用将起作用。

有几个解决方案:

最明显的一个是通过你的代码删除对console. 无论如何,您不应该在生产代码中留下这样的东西。

如果您想保留控制台引用,您可以将它们包装在一个if()语句中,或者在尝试调用它之前检查控制台对象是否存在的其他条件。

是否有任何解决方法可以保留调试代码?IE 是唯一具有这种愚蠢行为的浏览器......
2021-03-12 16:31:03
@Meekohiif(!console)会导致同样的错误 - 它应该读if(!window.console)
2021-03-15 16:31:03
所以...... IE 不应该实现每个新的 js 开发人员一直使用的功能,以避免惹恼一些使用脚本来修复本来应该工作的东西的开发人员......但这是不公平的为那个敲IE?你是一个非常慷慨的人斯普德利!!!:)
2021-03-19 16:31:03
IE11 仍然会发生
2021-03-21 16:31:03
if(!console) {console={}; console.log = function(){};}
2021-03-27 16:31:03

HTML5 Boilerplate有一个很好的预制代码来修复控制台问题:

// Avoid `console` errors in browsers that lack a console.
(function() {
    var method;
    var noop = function () {};
    var methods = [
        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
        'timeStamp', 'trace', 'warn'
    ];
    var length = methods.length;
    var console = (window.console = window.console || {});

    while (length--) {
        method = methods[length];

        // Only stub undefined methods.
        if (!console[method]) {
            console[method] = noop;
        }
    }
}());

正如@plus- 在评论中指出的,最新版本可在他们的GitHub 页面找到

它已从 HTML5 Boilerplate 存储库中删除。上一个版本是这个
2021-03-18 16:31:03
@plus 评论中的链接不再有效。代码已下推到src子目录:github.com/h5bp/html5-boilerplate/blob/master/src/js/plugins.js
2021-03-29 16:31:03

除了console.log问题之外,这是另一个可能的原因(至少在 IE11 中):

当控制台未打开时,IE 会执行非常积极的缓存,因此请确保任何$.ajax调用或XMLHttpRequest调用都将缓存设置为 false。

例如:

$.ajax({cache: false, ...})

当开发者控制台打开时,缓存不那么激进。似乎是一个错误(或者可能是一个功能?)

这只是救了我 ;) 谢谢!我会说这是一个错误,因为在控制台打开和关闭的情况下,您应该具有相同的条件来测试和调试您的网站。
2021-03-12 16:31:03
这应该更高,因为我认为这是实际答案......在某些 IE 版本中关于 console.log 的公认答案将引发错误,而不是导致此处描述的行为。
2021-03-21 16:31:03
为我工作。具体来说:stackoverflow.com/questions/13391563/...
2021-04-09 16:31:03

这在我对它进行了小改动后解决了我的问题。我在我的 html 页面中添加了以下内容以解决 IE9 问题:

<script type="text/javascript">
    // IE9 fix
    if(!window.console) {
        var console = {
            log : function(){},
            warn : function(){},
            error : function(){},
            time : function(){},
            timeEnd : function(){}
        }
    }
</script>
此解决方案不适用于 64 位 Windows 7 上的 IE 11。
2021-03-18 16:31:03
这解决了我在 64 位 Windows 7 上的 IE 11 上的问题。
2021-03-22 16:31:03

除了console在接受的答案和其他人中提到的“ ”使用问题之外,至少还有另一个原因,为什么有时 Internet Explorer 中的页面只能在开发人员工具激活的情况下工作。

启用开发人员工具后,IE 不会像在正常模式下那样真正使用其 HTTP 缓存(至少在 IE 11 中是默认设置)。

这意味着如果您的网站或页面存在缓存问题(例如,如果缓存超出应有的范围 - 这就是我的情况),您将不会在 F12 模式下看到该问题。因此,如果 javascript 执行一些缓存的 AJAX 请求,它们在正常模式下可能无法正常工作,而在 F12 模式下工作正常。

请参阅stackoverflow.com/questions/3984961/...了解如何禁用缓存 xmlHttpReq 请求。
2021-03-14 16:31:03
甜的。这出人意料地奏效了。我猜 Angular 的 $http 服务并没有像我想象的那样缓存 bust。
2021-03-31 16:31:03