Comment utilisez-vous $('document').ready(function()) en jQuery?

J'ai un morceau de code qui fonctionne bien sous IE, mais il ne fonctionne pas dans Firefox. Je pense que le problème est que je n'ai pas été en mesure de mettre en œuvre $('document').ready(function). La structure de mon json est comme [{"options":"smart_exp"},{"options":"user_intf"},{"options":"blahblah"}].
Je serai très reconnaissant si quelqu'un peut voir mon code & m'aider à appliquer correctement. Voici mon code:

<html><head>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2
     /jquery.min.js"></script>
     <script type="text/javascript" language="javascript">
     $(document).ready(function() { 
     $.getJSON("http://127.0.0.1/conn_mysql.php", function (jsonData) {
     $.each(jsonData, function (i, j) {
     document.form1.fruits.options[i] = new Option(j.options);
     });});
     });
     </script></head>
     <body><form name="form1">
     My favourite fruit is :
     <select name="fruits" id="fruits" /></form></body>
</html>

AH OK, merci pour le tuyau, effectivement je ne savais pas que je dois accepter aussi pour la reconnaissance .....
Ses pas quelque chose de stupide comme la façon dont vous définissez les fruits " options avec le document.form1.fruits.options[i] est-il? Je me demandais si c'est ce que firefox est de ne pas aimer plutôt que de l'ajax/onload pièces. Si vous vous en tenez à une alerte juste avant que fait-il déclenché? Ses un bon moyen de tester. Ou installer firebug et de regarder la console javascript pour les erreurs.
firebug est toujours en disant: "erreur de syntaxe" et " 'a' undefined ......" de nombreuses fois.Pour l'erreur de syntaxe, ses pointant sur la fermeture des accolades & parenthèse. J'ai vérifié plusieurs fois, mais je n'ai pas trouvé égaré OU oublié corset/la parenthèse. U peut le voir aussi.Une chose est de savoir si son erreur de syntaxe, que le pourquoi de son fonctionnement dans ie.
non, l'alerte ne se déclenche pas une option, même pas d'indice c'est à dire je. La console de Firebug montre pas d'erreur, seulement 4 avertissements.
J'ai corrigé le code, il est localhost aborder la méthode de problème. J'ai édité le code, 127.0.0.1 doit être utilisé en dépit de localhost dans geJson.

OriginalL'auteur XCeptable | 2010-10-21

2

Il suffit d'exécuter $(document).ready(function() {doStuff}). Ce sera exécuté automatiquement lorsque le document est prêt.

Il est préférable, au moins dans mon opinion, que vous ne mettez pas les événements dans le code html lui-même. De cette façon, vous séparer la structure d'un document html à partir de son comportement. Au lieu de joindre les événements dans le $(document).prêt de la fonction.
```
<html>
  <head>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
     <script type="text/javascript">
       $(document).ready(function() { 
           $.getJSON("http://localhost/conn_mysql.php", function (jsonData) {
             var selectElem = $('#fruits');

             for(var i = 0; i < jsonData.length; i++) { 
               selectElem.append($('<option>').html(jsonData[i].options));
             }

           });
       });
     </script>
  </head>
  <body>
    <form name="form1">
      My favourite fruit is :
      <select name="fruits" id="fruits" />
    </form>
  </body>
</html>
```
EDIT:
J'ai testé avec la suivante et se moque de l'objet json depuis je ne peux pas faire que de m'appeler.
```
<html>
  <head>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
     <script type="text/javascript">
       $(document).ready(function() {
           var jsonData = JSON.parse('[{"options":"smart_exp"},{"options":"user_intf"},{"options":"blahblah"}]');
           var selectElem = $('#fruits');

           for(var i = 0; i < jsonData.length; i++) { 
             selectElem.append($('<option>').html(jsonData[i].options));
           }

       });
     </script>
  </head>
  <body>
    <form name="form1">
      My favourite fruit is :
      <select name="fruits" id="fruits" />
    </form>
  </body>
</html>
```
onload ne sera pas? 🙂
Touche, je vais préciser.
maintenant il y a une confusion. À partir de ces réponses, il est maintenant apparent 2 moi qu'il y est seulement $(document).ready(function() doit être utilisé comme premier niveau de fonction dans le script, à l'intérieur duquel est $.getJson utilisé. Alors que ma compréhension est que j'ai son haut niveau de la fonction & à l'intérieur, je dois définir une autre fonction(comme je l'définir la précharge()) qui permettra de mettre en œuvre de dollars.getJson & cette fonction sera appelée comme je l'ai appelé avec l'événement onLoad. U peut bien vouloir me répondre à ce sujet.
Je vous renvoie vers api.jquery.com/ready. L' .prêt de la fonction sera appelée une fois que la page est entièrement chargée. Vous pouvez définir la fonction plusieurs fois si vous le souhaitez, ils vont se faire rouler lexicalement comme il est apparu sur la page. J'étais simplement dire que vous devez éviter d'utiliser l'événement onLoad dans le code html lui-même car il ne fournit pas beaucoup de flexibilité dans la conception.
OK, merci, qui ont eu un exemple clair. J'ai édité le code maintenant, mais c'est se comporter de la même c'est à dire en cours d'exécution dans IE mais pas avec firefox. Quoi de difficulté à maintenant.

OriginalL'auteur shoebox639
4

Version courte (suggéré par meeger): ne pas utiliser des guillemets simples autour de document.

document est une variable qui vient avec JavaScript (au moins dans le contexte du navigateur). Au lieu de cela, essayez ce qui suit pour la ligne concernée.

$(document).ready(function() {

Vous aurez également besoin de prendre l'attribut onLoad hors de la balise body, sinon il sera exécuté deux fois.

Pour résumer, ne pas utiliser de guillemets simples autour de document.
L'utilisation de guillemets n'était pas en cause; vous pourriez aussi avoir dit "ne pas utiliser des crochets ou des signes dollar ou des périodes ou des virgules autour de document"

OriginalL'auteur Dan G
2

Ici, il est dans toute sa gloire. L'abréviation, impressionnant de version:

Mis à JOUR
```
<script type="text/javascript" language="javascript">
    $(function() { 
        $.getJSON("http://localhost/conn_mysql.php", function (jsonData) {
            var cacheFruits = $('#fruits'),
                cacheOption = $(document.createElement('option'));

            $.each(jsonData, function (i, j) {
                cacheFruits.append(
                    cacheOption.clone().attr('value', j.options).html(j.options)
                );
            });
        });
    });
</script>
```
Bien sûr, je ne sais pas ce que votre structure JSON est, de sorte que vous pouvez avoir besoin de jouer avec l'ajout de la section du code.

Il devrait y avoir aucune raison pour que le ci-dessus ne fonctionnerait pas.

Je préfère utiliser $.ready(function) car elle est un peu moins de magie nommé. jQuery.prêt. Juste par curiosité, pourquoi ne pas $('<option/>') pour la création?
Je respecte votre position, mais je n'appellerais pas cela une magie. Eh bien, en fait je le ferais, mais pour des raisons différentes. 😉 La raison de la document.createElement() est dommage parce que c'est plus rapide que la chaîne analysée $('<option/>') version.
non, il n'est pas de travail. U dire que j'ai besoin de drop <body onload> moyenne, il ne devrait être qu'un normal corps de la balise <BODY>. La structure de mon json est comme [{"options":"smart_exp"},{"options":"user_intf"},{"options":"blahblah"}].
J'ai édité le code, de son encore en cours d'exécution dans ie mais pas avec firefox. U peut voir maintenant ce problème. merci
J'ai mis à jour le code. Si cela ne fonctionne pas, alors vous avez d'autres problèmes. Éventuellement un numéro en double ou d'autres problèmes de code HTML non valide.

OriginalL'auteur Stephen

Vous n'avez pas besoin de guillemets autour de document. Une fois la page complètement chargée, il va commencer l'exécution de ce que vous avez définis dans le prêt()

$(document).ready(function() { 
  $(this).getJSON("http://localhost/conn_mysql.php", function (jsonData) {
    $(this).each(jsonData, function (i, j) {
      document.form1.fruits.options[i] = new Option(j.options);
    });
  });
});

n'est pas de travail, même dans ie ...

OriginalL'auteur Andrew Sledge

0

Essayer cela, vos données json doit être dans ce format:
```
[{'text':'sometext','value':'somevalue'},{'text':'sometext','value':'somevalue'}];


$(document).ready(function() { 
  $(this).getJSON("http://localhost/conn_mysql.php", function (jsonData) {
    var options = [];
    $.each(jsonData, function (i, j) {
      options.push('<option value="' + j.value + '">'  + j.text + '</option>');
    });
    $('#fruits').html( options.join(''));
  });
});
```
Veuillez noter qu'il peut y avoir un encodage/s'échapper des problèmes ici.
Assurez-vous que vous échapper le texte correctement à partir du côté serveur.
htmlentities, htmlspecialchars peut vous aider avec ça.

Cela devrait fonctionner dans la plupart des navigateurs

sa ne fonctionne pas, même dans ie ...
Je l'ai testé, il n'est pas exécuté dans ie avec maintenant corrigé le code.

OriginalL'auteur jerjer

Vous devez vous connecter pour publier un commentaire.