Comment combiner plusieurs fonctions jquery

Si vous affichez le jquery, le code ci-dessous, vous verrez la célèbre $(document).ready(function(){ qui démarre le script off. Je vois ce sur à peu près tous jquery exemples de code sur le net et je suis désireux de savoir, si je suis en cours d'exécution 5 différentes fonctions de code dans un seul fichier dois-je utiliser $(document).ready(function(){ au début de chacun d'eux?

Si non, comment aurais-je combiner, par exemple, le code ci-dessous dans une page de 3 fois, faire semblant c'est 3 codes différents?

<script type="text/javascript" >
 $(document).ready(function(){
  setTimeout(function(){
  $(".flash").fadeOut("slow", function () {
  $(".flash").remove();
      }); }, 2000);
 });
</script>
InformationsquelleAutor JasonDavis | 2009-08-09
  1. 13

    Vous devriez essayer de ne pas trop en mettre à l'intérieur de la doc prêt blocs. Oui, vous pouvez avoir de multiples, mais je m'en tiens à un si tout. Vous pouvez également mettre votre script juste avant la balise de fermeture body sans la nécessité pour le document de prêt.

    Je conseille de casser le code dans des fonctions distinctes. De cette façon, vous pouvez les réutiliser tout au long de votre page à des stades différents. Alors utilisez simplement la doc prêt bloc de déclencher un appel pour que les pages init.

    Vous pouvez également utiliser $(function(){}); comme un raccourci pour $(document).ready(function(){});

    <script type="text/javascript" >
 $(function(){
    init();
 });

 function init(){
   someFunction();
   //other init stuff
 }

 function someFunction(){
  setTimeout(function(){
     $(".flash").fadeOut("slow", function () {
     $(".flash").remove();
   }); }, 2000);

 }
</script>
    • Je ne suis pas en désaccord avec la réutilisation du tout, mais ce qui est gagné par l'aide de la fonction init au lieu de l'appel someFunction directement dans .est-il prêt ?
    • Dire que j'ai une fonction que l'installation d'un accordéon et plus tard dans le cycle de la page je l'ai chargé dans un contenu différent à l'aide d'ajax et nécessaires à la ré initialiser l'accordéon. Si j'avais bourré le code de la doc prêt, je ne pouvais pas le réutiliser.
    • Il permet également d'améliorer la trace de la pile lors du débogage que vous obtenez nommé à des fonctions plutôt que des fonctions anonymes
    • mauvais acheter, merci
    InformationsquelleAutor redsquare
  2. 10

    Je pense que l'affiche originale a été demandé s'il doit le faire:

    <script>
 $(document).ready(function(){
        func1();
});
</script>
<script>
 $(document).ready(function(){
        func2();
});
</script>

    Ou s'il suffit de faire ceci:

    <script>
 $(document).ready(function(){
      func1();
      func2();
});
</script>

    Dans le dernier exemple, il y a un script et un document prêt déclaration. Beaucoup plus propre. Je crois que la réponse est oui, vous pouvez le faire le plus tard sans aucun problème.

    InformationsquelleAutor Randy Greencorn
  3. 4

    Le problème est que vous ne comprenez pas ce que le prêt événement est et pourquoi vous en avez besoin.

    Imaginer qu'une page n'a pas encore chargé complètement et vous essayez de changer quelque chose sur elle avec un peu de javascript et depuis le code HTML de l'élément que vous essayez de manipuler n'est même pas encore chargé, les choses vont mal.

    L'événement ready résout ce problème. Toute fonction (le plus souvent un seul fonction anonyme) que vous liez à le prêt de l'événement est exécuté dès que tous les les éléments du document sont prêts à être traversés et manipulé. Il est considéré comme une mauvaise pratique d'avoir tout le javascript en ligne. Si vous voulez un événement(clic,passez la souris,etc) pour travailler sur votre page, vous devez l'appeler à l'intérieur de l' $(document).prêt() fonction.

    Et depuis une page est chargée une fois, une fonction qui est lié à l'événement ready obtenez seulement appelé une seule fois. Donc il n'y a pas beaucoup de sens dans la liaison plusieurs fonctions de l'événement ready. Vous pouvez tout faire dans qui a une fonction qui vous lier à elle. Cependant, il ne nuira en rien (tant que vous comprenez ce que vous faites) puisque chaque fonction que vous avez lié à l'événement ready sera appelée une fois le DOM est prêt.

    Je ne comprends pas ce que vous essayez d'atteindre en exécutant le même morceau de code à cinq fois... donc je ne peux pas vous aider avec ça.

    J'espère que cette explication vous aide à résoudre votre problème.

    InformationsquelleAutor Tarnay Kálmán
  4. 2

    n u n'avez pas besoin , il suffit de mettre dans un seul, et de déclencher toutes les fonctions à partir de là;

    <script type="text/javascript" >
 $(document).ready(function(){
        func1();
        func2();
        ...
});
</script>
    • Je suis encore confus sur la façon de le faire bien, je veux dire vous dire déclencher les fonctions, donc, je voudrais simplement appeler setTimeout(function(){ ou ce besoin d'être mis dans une fonction, désolé, je ne connais pas le javascript est beaucoup différente de la syntaxe, alors php
    • ok je l'ai eu merci
    • C'est aussi une bonne idée de séparer vos fonctions javascript de la page, dans une .fichier js. Cela permet généralement de IDEs/éditeurs de mieux travailler avec, vous pouvez minimiser tous de votre javascript, etc. Quand tout est extériorisé comme cela, vous pouvez simplement appeler toutes vos fonctions d'initialisation avec un bloc sur la page d'Abu montre ci-dessus.
    InformationsquelleAutor Abu Aqil
  5. 1

    Tout d'abord, vous pouvez raccourcir de:

    <script type="text/javascript" >
    jQuery(function() {
        ...
    });
</script>

    Deuxième, si vous voulez que vos scripts à exécuter quand la page a fini de se charger, alors oui, vous devez les placer dans un jQuery/document.ready() fonction. Vous pouvez les mettre tous dans le même jQuery(function () { }) bloc bien et qu'ils vont être exécutés dans l'ordre, vous n'avez pas à les séparer.

    De s'étendre sur le fonctionnement de function() {} blocs:

    jQuery(/* do something */);

    signifie "au chargement de la page, de faire quelque chose". Que "faire quelque chose" est une fonction. Vous pouvez passer directement à la fonction comme ceci:

    function myFunction() {
    ...
}

jQuery(myFunction);

    Vous avez défini une fonction "myFunction" et dit jQuery pour l'exécuter au chargement de la page. Notez que vous venez de passer la fonction elle-même de jQuery, sans (). Si vous voulez écrire jQuery(myFunction()); au lieu de cela, que l'exécution de myFunction() immédiatement, et tout ce qui est retourné par myFunction() serait placé dans jQuery(), et qui sera exécuté lors du chargement de la page. C'est un peu différent des langues comme le PHP, et qu'en PHP c'est le comportement souhaité pour exécuter tout, tout de suite, en Javascript qui ne l'est pas nécessairement. En PHP, vous ne pouvez pas passer à la fonction elle-même autour de, en Javascript, vous pouvez. Des fonctions en Javascript agissent beaucoup plus comme des variables.

    Ce que tu fais habituellement est de "rattraper une fonction à la volée" qui contient un bloc de code que vous souhaitez exécuter à un moment plus tard:

    jQuery(function () {
    foo();
    bar();
});

    Dans ce cas, vous êtes de passage d'une fonction en tant que bien, tout simplement que vous l'avez fait jusqu'à la volée et la fonction n'ont pas un nom. jQuery tiendra sur cette fonction jusqu'au chargement de la page, au moment où il va l'exécuter. À l'intérieur de cette fonction, vous pouvez faire autant de choses que vous le souhaitez.

    InformationsquelleAutor deceze