为什么JavaScript只在IE中打开一次开发人员工具后才能工作?
IE9错误-JavaScript只在打开开发人员工具一次后才起作用 我们的网站为用户提供免费的pdf下载,并且有一个简单的“输入下载密码”功能。但是,它在InternetExplorer中根本不起作用 你可以看到自己在这 下载通行证是“makeuseof”。在任何其他浏览器中,它都可以正常工作。在IE中,两个按钮都不起作用 我发现最奇怪的是,如果你用F12打开和关闭开发者工具栏,它就会突然开始工作 我们已经尝试过兼容模式,没有什么不同为什么JavaScript只在IE中打开一次开发人员工具后才能工作?,javascript,internet-explorer,internet-explorer-9,Javascript,Internet Explorer,Internet Explorer 9,IE9错误-JavaScript只在打开开发人员工具一次后才起作用 我们的网站为用户提供免费的pdf下载,并且有一个简单的“输入下载密码”功能。但是,它在InternetExplorer中根本不起作用 你可以看到自己在这 下载通行证是“makeuseof”。在任何其他浏览器中,它都可以正常工作。在IE中,两个按钮都不起作用 我发现最奇怪的是,如果你用F12打开和关闭开发者工具栏,它就会突然开始工作 我们已经尝试过兼容模式,没有什么不同 如何在Internet Explorer中实现此功能?听起来
如何在Internet Explorer中实现此功能?听起来您的javascript中可能有一些调试代码 您描述的体验是包含
console.log()
或任何其他console
功能的典型代码
控制台
对象仅在打开开发工具工具栏时激活。在此之前,调用console对象将导致将其报告为未定义
。打开工具栏后,控制台将存在(即使工具栏随后关闭),因此控制台调用将工作
有几种解决方案:
最明显的一个方法是遍历代码,删除对控制台的引用。无论如何,你不应该在生产代码中留下这样的东西
如果要保留控制台引用,可以将它们包装在If()
语句中,或其他一些条件中,在尝试调用控制台对象之前检查控制台对象是否存在。我想这可能会有所帮助,在javascript的任何标记之前添加以下内容:
try{
console
}catch(e){
console={}; console.log = function(){};
}
这解决了我的问题后,我做了一个小的改变。为了解决IE9问题,我在html页面中添加了以下内容:
<script type="text/javascript">
// IE9 fix
if(!window.console) {
var console = {
log : function(){},
warn : function(){},
error : function(){},
time : function(){},
timeEnd : function(){}
}
}
</script>
//IE9修复
如果(!window.console){
变量控制台={
日志:函数(){},
警告:函数(){},
错误:函数(){},
时间:函数(){},
timeEnd:function(){}
}
}
有一个很好的预制代码,用于解决控制台问题:
// 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在评论中指出的,最新版本可在他们的上获得,除了在接受答案中提到的“控制台
”使用问题和其他问题之外,至少还有另一个原因,为什么Internet Explorer中的页面有时仅在激活开发人员工具的情况下工作
启用开发工具后,IE不会像在正常模式下那样真正使用其HTTP缓存(至少在IE11中是默认的)
这意味着,如果您的站点或页面存在缓存问题(例如,如果它缓存的内容超过了应该缓存的内容,这就是我的情况),您将不会在F12模式下看到该问题。因此,如果javascript执行一些缓存的AJAX请求,它们在正常模式下可能无法正常工作,在F12模式下也可以正常工作。我为提供的解决方案找到了另一种选择,这也避免了在对的回答的评论中讨论的陷阱:
try {
console.log(message);
} catch (e) {
}
它有点邋遢,但另一方面,它很简洁,涵盖了“答案”中涵盖的所有日志记录方法,它有一个巨大的优势,即您可以随时打开IE的控制台窗口,日志就会源源不断地出现。除了控制台.log
问题之外,还有另一个可能的原因(至少在IE11中):
当控制台未打开时,IE会进行非常积极的缓存,因此请确保任何$.ajax
调用或XMLHttpRequest
调用都将缓存设置为false
例如:
$.ajax({cache: false, ...})
当开发人员控制台打开时,缓存的攻击性较小。似乎是一个bug(或者可能是一个功能?如果您使用的是AngularJS 1.X版,您可以使用$log服务,而不是直接使用console.log
简单的日志服务。默认实现将消息安全地写入浏览器控制台(如果存在)
所以如果你有类似于
angular.module('logExample',[])
.controller('LogController',['$scope',函数($scope){
log('helloworld!');
}]);
你可以用
angular.module('logExample',[])
.controller('LogController',['$scope','$log',函数($scope,$log){
$log.log('Hello World!');
}]);
角度2+。这发生在我的IE 11中。我调用了jquery.load函数。
所以我用老办法做了,在url中添加了一些东西来禁用缓存
$("#divToReplaceHtml").load('@Url.Action("Action", "Controller")/' + @Model.ID + "?nocache=" + new Date().getTime());
如果您使用的是angular
和ie9、10
或edge
使用:
myModule.config(['$httpProvider', function($httpProvider) {
//initialize get if not there
if (!$httpProvider.defaults.headers.get) {
$httpProvider.defaults.headers.get = {};
}
// Answer edited to include suggestions from comments
// because previous version of code introduced browser-related errors
//disable IE ajax request caching
$httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT';
// extra
$httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
$httpProvider.defaults.headers.get['Pragma'] = 'no-cache';
}]);
要完全禁用缓存
我们在Windows7和Windows10的IE11上遇到了这个问题。通过启用IE的调试功能(IE>Internet选项>高级选项卡>浏览>取消选中禁用脚本调试(Internet Explorer)),我们发现了问题的症结所在。域管理员通常会在我们的环境中检查此功能
问题是因为我们在JavaScript代码中使用了console.debug(…)
方法。开发人员(我)的假设是,如果客户端开发人员工具控制台未显式打开,我不希望编写任何内容。虽然Chrome和Firefox似乎同意这一策略,但IE11一点也不喜欢。通过将所有console.debug(…)
语句更改为console.log(…)
语句,我们能够继续在客户端控制台中记录附加信息,并在其打开时查看它,但对典型用户隐藏它。我为我的问题提出了解决方案和修复方案。看起来我放在JavaScript中的AJAX请求没有被处理,因为我的页面有一些缓存问题。如果您的站点或页面存在缓存问题,则在developers/F12模式下不会看到该问题。我缓存的JavaScript AJAX请求它可能无法按预期工作
$.ajax({
cache: false,
});