2010-10-22 5 views
0

J'essaye d'écrire un menu dont les subitems disparaissent quand la page est chargée.Jquery "cacher sur le chargement" provoquant une erreur Javascript

Si vous avez besoin de HTML complet, je vais le copier, mais il se compose seulement d'un groupe de DIV, les éléments sous les en-têtes ont une classe de subitems.

J'ai réussi à faire ce que je besoin via:

$(document).ready(

    $(".subitems").hide() 

    ); 

Cependant, dans Chrome, bien qu'il fonctionne très bien, je reçois l'erreur suivante dans la console:

alt text (utilisant l'image comme Je ne peux pas bien copier le formatage)

Lorsque je supprime le code ci-dessus, l'erreur disparaît. Je suppose que j'ai fait quelque chose de mal, mais je ne peux pas le voir et jusqu'à présent cela fonctionne dans tous les navigateurs que j'ai testés.

Toute suggestion sur: soit

  1. Ai-je fait quelque chose de mal?
  2. Existe-t-il un meilleur moyen de réaliser ce que je veux?

Répondre

3

Vous manquez l'emballage fonction anonyme (function() { }), comme ceci:

$(document).ready(function() { 
$(".subitems").hide(); 
}); 

Il essaie de faire $(".subitems").hide().call() sous les couvertures quand il exécute les gestionnaires ready ... mais ce n'est pas une fonction. Au lieu de cela, il exécute immédiatement (pas sur document.ready) et lançant une erreur lorsque document.ready essaie d'exécuter le résultat de .hide().

Juste à noter, il y a une plus courte forme de ce qui précède ainsi:

$(function() { 
$(".subitems").hide(); 
}); 
+0

Bon sang, vous êtes bon! Une réponse en 30 secondes! ... Travaux. Je ne pense pas que vous pouvez poster un lien vers quelque part qui l'explique un peu plus en détail? C'est génial que ça marche (donc ça marquera comme réponse), mais je mentirais si je disais que j'ai compris pourquoi/comment. – Wil

+0

ok ... édité que j'ai tapé ce commentaire! Merci beaucoup! .... Juste une chose qui m'embrouille, pourquoi cela fonctionne-t-il réellement et cause une erreur au lieu de simplement causer une erreur? (fait +1, mais doit attendre pour marquer comme réponse) – Wil

+1

@Wil - Ok donc '.ready()' prend un gestionnaire (comme '.click() ', etc), il s'attend à ce qu'une * fonction * soit exécutée lorsque" l'événement "(pas un événement réel dans ce cas) se produit. Ce qui * arrivait * c'est qu'il courait '$ (". Subitems "). Hide()' * immédiatement * (comme tout autre appel de fonction) alors le * résultat * de ce qui est passé dans '.ready()' . Le problème est que c'est un objet jQuery que '.hide()' renvoie (pour le chaînage), pas une 'function' qui a la méthode [' .call() '] (https://developer.mozilla.org/en/ JavaScript/Référence/Global_Objects/Fonction/Appel). –

3

Comme l'erreur est résolu, peut-être il y a une autre façon de le faire.
Je suppose que vous ne vouliez pas vraiment vous cacher lors du chargement de la page, mais que vous voulez cacher si javascript est actif (vous utilisez prêt à avoir accès aux objets). Si j'ai raison, il y a un moyen plus facile. Donnez la <html> une classe

$('html').addClass('scripted') 

(comme <html> est connu chaque/partout, vous pouvez déjà le faire à l'intérieur du <head>)

... alors vous serez en mesure de cacher les objets via css et don pas besoin d'attendre prêt()

html.scripted .subitems{display:none}/*only hidden if js is off*/ 
+0

Je ne peux pas marquer comme réponse que la question était vraiment sur ce problème spécifique (Quel Nick a résolu), cependant, j'aime vraiment cette approche et ira probablement avec (une légère modification). Merci. – Wil

Questions connexes