Pregunta ¿Por qué JavaScript solo funciona después de abrir las herramientas de desarrollador en IE una vez?


IE9 Bug - JavaScript solo funciona después de abrir las herramientas de desarrollador una vez.

Nuestro sitio ofrece descargas gratuitas de PDF a los usuarios, y tiene una función simple de "ingresar la contraseña para descargar". Sin embargo, no funciona en absoluto en Internet Explorer.

Puedes verlo por ti mismo en esto ejemplo.

El pase de descarga es "makeuseof". En cualquier otro navegador, funciona bien. En IE, ambos botones no hacen nada.

Lo más curioso que he encontrado es que si abres y cierras la barra de herramientas del desarrollador con F12, todo comienza a funcionar de repente.

Hemos probado el modo de compatibilidad y tal, nada hace la diferencia.

¿Cómo hago que esto funcione en Internet Explorer?


608
2017-10-12 15:44


origen


Respuestas:


Parece que podría tener algún código de depuración en su javascript.

La experiencia que describes es típica del código que contiene console.log() o cualquiera de los otros console funcionalidad.

los console objeto solo se activa cuando se abre la barra de herramientas Dev. Antes de eso, llamar al objeto de la consola dará como resultado que se informe como undefined. Después de que se haya abierto la barra de herramientas, la consola existirá (incluso si la barra de herramientas se cierra posteriormente), de modo que las llamadas de la consola funcionarán.

Hay algunas soluciones a esto:

El más obvio es revisar su código eliminando referencias a console. No deberías dejar cosas así en el código de producción de todos modos.

Si desea mantener las referencias de la consola, puede envolverlas en una if() declaración, o algún otro condicional que comprueba si el objeto de la consola existe antes de intentar llamarlo.


782
2017-10-12 15:51



Boilerplate HTML5 tiene un buen código prefabricado para solucionar problemas de consola:

// 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;
        }
    }
}());

Como @ plus- señaló en los comentarios, la última versión está disponible en su Página de GitHub


158
2017-09-07 09:58



Aquí hay otra posible razón además de la console.log problema (al menos en IE11):

Cuando la consola no está abierta, IE hace un almacenamiento en caché bastante agresivo, así que asegúrese de que $.ajax llamadas o XMLHttpRequest las llamadas tienen el almacenamiento en caché establecido en falso.

Por ejemplo:

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

Cuando la consola de desarrollador está abierta, el almacenamiento en caché es menos agresivo. Parece ser un error (¿o tal vez una característica?)


142
2017-08-06 21:28



Esto resolvió mi problema después de que le hice un cambio menor. Agregué lo siguiente en mi página html para solucionar el problema de IE9:

<script type="text/javascript">
    // IE9 fix
    if(!window.console) {
        var console = {
            log : function(){},
            warn : function(){},
            error : function(){},
            time : function(){},
            timeEnd : function(){}
        }
    }
</script>

62
2017-09-06 19:39



Junto al 'console'problema de uso mencionado en la respuesta aceptada y otros, hay al menos otra razón por la que a veces las páginas en Internet Explorer funcionan solo con las herramientas de desarrollador activadas.

Cuando Developer Tools está habilitado, IE realmente no usa su caché HTTP (al menos por defecto en IE 11) como lo hace en modo normal.

Significa que si su sitio o página tiene un problema de almacenamiento en caché (si almacena en caché más de lo que debería, por ejemplo, ese era mi caso), no verá ese problema en el modo F12. Entonces, si el javascript realiza algunas solicitudes AJAX almacenadas en caché, es posible que no funcionen como se esperaba en el modo normal y funcionen bien en el modo F12.


28
2018-05-29 17:24



Supongo que esto podría ayudar, agregando esto antes de cualquier etiqueta de javascript:

try{
  console
}catch(e){
   console={}; console.log = function(){};
}

17
2018-04-20 13:23



Si está utilizando AngularJS versión 1.X, podría usar el servicio $ log en lugar de usar console.log directamente.

Servicio simple para el registro. La implementación predeterminada escribe el mensaje de forma segura en la consola del navegador (si está presente).

https://docs.angularjs.org/api/ng/service/$log

Entonces, si tienes algo similar a

angular.module('logExample', [])
  .controller('LogController', ['$scope', function($scope) {
    console.log('Hello World!');
 }]);

puedes reemplazarlo con

angular.module('logExample', [])
  .controller('LogController', ['$scope', '$log', function($scope, $log) {
    $log.log('Hello World!');
 }]);

Angular 2+ no tiene ningún servicio de registro incorporado.


8
2017-08-14 18:37