jQuery de détection du navigateur Ne semble pas fonctionner

Question

En raison de l'incapacité de IE à disparaître, j'ai décidé de changer ma fonction de PNG transparent pour afficher simplement la PNG si l'utilisateur utilise IE mais pour les fanent si elles utilisent un autre navigateur. La fonction ci-dessous fonctionne bien dans IE et fait ce que je l'espère, mais dans tout autre navigateur, c'est-à-dire Firefox, Safari ne fait rien, ai-je oublié quelque chose ou ai-je une erreur de syntaxe?

$('#content2 a').click(function(){ 

if($.browser.msie){ 

     var toLoad = $(this).attr('href')+' #content'; 
     $('#content').show(loadContent); 

     window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
     function loadContent() { 
      $('#content').load(toLoad,'',showNewContent()) 
     } 
     function showNewContent() { 
      $('#content').show(); 
     } 

     return false; 

}else{ 

     var toLoad = $(this).attr('href')+' #content'; 
     $('#content').fadeOut('slow',loadContent); 
     $('#load').remove(); 
     $('#wrapper').append('<span id="load">LOADING...</span>'); 
     $('#load').fadeIn('slow'); 
     window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
     function loadContent() { 
      $('#content').load(toLoad,'',showNewContent()) 
     } 
     function showNewContent() { 
      $('#content').fadeIn('slow',hideLoader()); 
     } 
     function hideLoader() { 
      $('#load').fadeOut('slow'); 
     } 
     return false; 

}; 

}); 

Answer 1

La plupart de vos callbacks sont écrits comme ceci:

$('#content').load(toLoad,'',showNewContent()) 

qui dit appel showNewContent, et passer sa valeur de retour à jQuery.

Vous voulez dire:

$('#content').load(toLoad, '', showNewContent); 

Mais vous avez aussi un problème potentiel ici:

}else{ 
    ... 
    $('#content').fadeOut('slow',loadContent); 
    ... 
    function loadContent() { 

Il est pas vraiment légal de mettre une déclaration function l'intérieur d'un else ou tout autre bloc d'une autre fonction. En effet, la magie de l'instruction function qui vous permet d'utiliser une fonction dans le code ci-dessus où vous la définissez ne peut fonctionner que si la définition de la fonction est corrigée avant le lancement de la fonction. Cela ne peut pas arriver si la définition est à l'intérieur d'un bloc conditionnel.

Comme d'habitude le saignement avec JavaScript, au lieu de vous parler de l'erreur, les navigateurs vous permettent de sortir avec elle, mais avec des résultats incohérents et bizarres. Voici un cas de test évidemment paradoxale:

x(); 
var isgood= Math.random()*2>=1; 

if (isgood) { 
    function x() { 
     alert('Good!'); 
    } 
} else { 
    function x() { 
     alert('Bad!'); 
    } 
} 

Ce code exemple essaie d'appeler une fonction qui est fonction du résultat d'un tirage au sort avant cet événement a effectivement eu lieu. Ce devrait être une erreur de syntaxe juste pour le dire, mais chaque navigateur le permet. Mozilla laisse au moins x en maintenant undefined jusqu'à ce qu'une instruction de fonction soit atteinte, ainsi le x() initial provoquera une erreur. Dans IE, Webkit et Opera, cependant, la deuxième instruction function 'gagne' et elle alerte toujours "Mauvais!". Mauvais navigateurs!

éviter ce problème en utilisant des expressions de fonction inline au lieu des instructions de fonction toute fois que vous avez besoin d'une fonction dont la définition des changements. Bien que dans ce cas, vous pouvez contourner le problème fading en utilisant simplement un speed de 0 pour IE pour le faire callback instantanément, ce qui rend la chose beaucoup plus simple:

$('#content2 a').click(function() { 
    var speed= $.browser.msie? 0 : 'slow'; 
    $('#content').fadeOut(speed, function() { 
     $('#content').load($(this).attr('href')+' #content', '', function() { 
      $('#content').fadeIn(speed); 
     }); 
    }); 
}); 

Answer 2

Peut-être devriez-vous ajouter le ';' à la fin de la ligne:

$('#content').load(toLoad,'',showNewContent()); 

dans les deux définitions de loadContent().