web-dev-qa-db-ja.com

JSを使用するWebサイトは、開発者ツールがアクティブになるまでIE9で機能しません

私はjQueryと多くのスクリプトを大いに活用する複雑なWebサイトを開発しています。サイトのロード時には、スクリプトは機能していません（ただし、他のスクリプトが正常に機能していることは確認できます）。私は、1つのことを除いて、SEにこのような不自由な質問をここに投稿することはありません。

F12キーを押して開発者ツールを有効にすると、問題をデバッグできるようになり、すべてが即座に完全に機能します！

さらに悪いことに、ブラウザをシャットダウンして起動し、最初にDev Toolsをオンにしてサイトにアクセスすると、すべてが正常に機能します。

だから、開発ツールはそれを修正するので、私はあえてこの問題をデバッグすることさえできません！物事を機能させる開発ツールは何をしているのでしょうか？ UAを変更しますか（jQuery.browserの検出を行います）？それはDoctypeに何かをしますか？

編集

すべてのコンソールロギングは、次のラッパーユーティリティ関数でラップされます。

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

私が試みることができるどんな考えまたは提案も歓迎されるでしょう。解決策が見つかったら、ここに投稿します。

javascriptinternet-explorer-9
59
Tom Auger

私はここでのパーティーにかなり遅れていることを感謝していますが、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が利用可能になったらすぐにデータをプッシュすればいいのですが、これはカスタムsetIntervalリスナーを設定するよりも安価です。

更新された機能（2012年10月1日）

私は自分で使用するためにこのスクリプトを更新し、共有したいと考えました。いくつかの価値のある改善点があります。

  • 通常のように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();
})();
_
34
Liam Newmarch

IEでコンソール呼び出しがあります。開発ツールが開いていない場合、これらは失敗します。簡単な修正は、コンソール呼び出しを次のような関数でラップすることです。

function log(msg) {
  if(console)
    console.log(msg);
}
13
J T

他のほとんどのソリューションはうまく機能するはずですが、コンソールが使用できない場合にログメッセージをキャッチする必要がない場合は、ここに短いライナーがあります。

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

これにより、毎回何かをラップしたり条件を設定したりする代わりに、ネイティブのconsole.log関数を直接使用できます。

2
Jasmine Hegman

次の方法でハッキングしました

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

そして、これはの最初のスクリプト要素です。

2
benqus

IE9でコンソールを検出するには、使用したconsole.logラッパーでは不十分でした。動作するラッパーは次のとおりです 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")

1
Tom Auger

ラッパー関数を使用するよりも、単にconsole && console.log('foo', 'bar', 'baz')を使用する方がはるかに便利だと思います。

あなたが提供したコード：

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

consoleが定義されていないため、devツールが閉じられたときにIEに対してエラーを生成します。

1
zzzzBov

私はこの問題に何度も遭遇しました。基本的に変数を使用して、これらが有効かどうかを確認します

var somevar;
if (somevar)
 //do code

somevarは未定義に解決されるため、これは機能します。しかし、たとえばウィンドウのプロパティをチェックする場合。 window.console。

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);
 }
}
0
John

複数の並列スクリプトファイルがある場合、開発者ツールのオン/オフにより、ファイルが異なる順序でロード/実行されている可能性があります。

0
Zhonk