Сайт с JS не работает в IE9, пока не будут активированы инструменты разработчика


Я разрабатываю сложный сайт, который сильно использует jQuery и ряд скриптов. При загрузке сайта ни один из моих сценариев не работает (хотя я могу подтвердить, что другие сценарии работают нормально). Я бы не стал публиковать такой хромой вопрос здесь, на SE, за исключением одной вещи:

в тот момент, когда я нажму F12, чтобы включить инструменты разработчика, чтобы я мог отладить свою проблему, все мгновенно работает отлично!

хуже, если я выключу браузер, запустите его, включите Dev Инструменты сначала и посетите сайт, все работает так, как ожидалось.

поэтому я даже не могу отладить проклятую проблему, потому что Dev Tools исправляет ее! Что могут делать инструменты Dev, которые заставляют все работать? Это меняет UA (я делаю некоторые jQuery.обнаружение браузера)? Это что-то делает с doctype?

EDIT

все мои консольные журналы завернуты в следующую функцию утилиты оболочки:

   function log(msg){
    if (console){
        console.log(msg);
    }
   }

любые мысли или предложения, которые я мог бы попробовать, будут приветствоваться. Я опубликую здесь, если найду решение.

8 59

8 ответов:

я ценю, что я довольно поздно на вечеринку здесь, но у меня есть решение для IE9, которое немного отличается.

(function() {
    var temp_log = [];
    function log() {
        if (console && console.log) {
            for (var i = 0; i < temp_log.length; i++) {
                console.log.call(window, temp_log[i]);
            }
            console.log.call(window, arguments);
        } else {
            temp_log.push(arguments);
        }
    }
})();

в принципе, вместо console.log вы используете log. Если console.log существует, то он работает как обычно, в противном случае он хранит записи журнала в массиве и выводит их на следующий log здесь console доступно.

было бы неплохо, если бы он нажал данные, как только console доступно, но это дешевле, чем настройка a пользовательский прослушиватель setInterval.

обновленная функция (1 октября 2012)

я обновил этот скрипт для собственного использования и думал, что поделюсь им. Он имеет несколько достойных улучшений:

  • использовать console.log() как обычно, т. е. больше не нужно использовать нестандартные log()
  • поддерживает несколько аргументов, например,console.log('foo', 'bar')
  • вы также можете использовать console.error,console.warn и console.info (хотя выводит их как console.log)
  • сценарий проверяет на родной console каждые 1000 мс и выводит буфер, когда нашел

я думаю, что с этими улучшениями, это стало довольно твердой оболочки для IE9. Проверьте РЕПО GitHub здесь.

if (!window.console) (function() {

    var __console, Console;

    Console = function() {
        var check = setInterval(function() {
            var f;
            if (window.console && console.log && !console.__buffer) {
                clearInterval(check);
                f = (Function.prototype.bind) ? Function.prototype.bind.call(console.log, console) : console.log;
                for (var i = 0; i < __console.__buffer.length; i++) f.apply(console, __console.__buffer[i]);
            }
        }, 1000); 

        function log() {
            this.__buffer.push(arguments);
        }

        this.log = log;
        this.error = log;
        this.warn = log;
        this.info = log;
        this.__buffer = [];
    };

    __console = window.console = new Console();
})();

у вас есть консольные вызовы, в IE они не будут работать, если инструменты разработки не открыты. Простое исправление заключается в том, чтобы обернуть любые вызовы консоли в функции, такие как:

function log(msg) {
  if(console)
    console.log(msg);
}

я взломал его следующим образом

<script type="text/javascript">
    (function () {
        if (typeof console == "undefined") {
            console = {
                log : function () {}
            }
        }
    })();
</script>

и это первый элемент скрипта в системе .

большинство других решений должно работать отлично, но вот короткий один лайнер, если вы не заботитесь о перехвате сообщений журнала, если консоль недоступна.

// Stub hack to prevent errors in IE
console = window.console || { log: function() {} };

Это позволяет по-прежнему использовать собственную консоль.функция log напрямую по-прежнему вместо того, чтобы обертывать ее чем-либо или иметь условный каждый раз.

Я считаю, что гораздо удобнее просто использовать console && console.log('foo', 'bar', 'baz') вместо того, чтобы использовать функцию-обертку.

код, который вы предоставили:

function logError(msg){
  if (console) {
    console.log(msg);
  } else {
    throw new Error(msg);
  }
}

будет выдавать ошибку для IE, когда dev tools закрыты, потому что console будет неопределена.

консоли.обертка журнала, которую я использовал, была недостаточна для обнаружения консоли в IE9. Вот обертка, которая работает из связанного вопроса на SE:

function logError(msg){
    try {
        console.log(msg);
    } catch (error) {
        throw new Error(msg);
    }
}

function log(msg){
    try {
        console.log(msg);
    } catch (error) { }
}

правильный тест на доступность объекта консоли будет: if (typeof console === "undefined" || typeof console.log === "undefined")

Если у вас есть несколько параллельных файлов сценариев, возможно, файлы загружаются/выполняются в другом порядке с помощью инструментов разработчика вкл/выкл.

Я сталкивался с этой проблемой много раз. В основном с переменными мы делаем это, чтобы проверить, если они действительны

var somevar;
if (somevar)
 //do code

это работает, потому что somevar будет разрешать неопределенное. Но если вы проверяете свойство окна, например. окно.приставка.

if (console) <---- this throws an exception

вы не можете сделать ту же проверку. Браузер относится к нему по-разному. В основном только делать это

if (window.console) <---- will NOT throw an exception if undefined
//some code

это будет работать так же, как в первом примере. Поэтому вам нужно изменить свой код к

function log(msg){
 if (window.console){
     console.log(msg);
 }
}