Comment rendre une fonction définie dans jQuery.ready disponible globalement ?

Question

J'ai une fonction qui enlève l'identifiant youtube d'une url. Je veux ensuite utiliser cette fonction 10 fois par page (dans la boucle wordpress).

La fonction fonctionne parfaitement lorsque je lui fournis l'url à l'intérieur de mes balises script de fonction, mais lorsque je commence un nouvel ensemble de balises script à l'intérieur de la boucle, elle ne fonctionne pas.

J'ai besoin de savoir comment je peux utiliser ma fonction sans tout déclarer d'abord.

Voici donc le code que j'ai dans l'en-tête :

 <script type="text/javascript"> 
$(document).ready(function() {
var getList = function(url, gkey){
        var returned = null;
        if (url.indexOf("?") != -1){
          var list = url.split("?")[1].split("&"),
                  gets = [];

          for (var ind in list){
            var kv = list[ind].split("=");
            if (kv.length>0)
                gets[kv[0]] = kv[1];
        }

        returned = gets;

        if (typeof gkey != "undefined")
            if (typeof gets[gkey] != "undefined")
                returned = gets[gkey];

        }

            return returned;

    };

        // THIS WORKS

    alert(getList('http://www.youtube.com/watch?v=dm4J5dAUnR4', "v"));

      });

Mais lorsque j'essaie de l'utiliser ailleurs sur la page, cela ne fonctionne pas.

 <script type="text/javascript"> 

      $(document).ready(function() {
              alert(getList('http://www.youtube.com/watch?v=dm4J5dAUnR4', "v"));
      };
      </script>

Firebug me donne getList n'est pas défini ce qui est logique, car ce n'est pas le cas. Puis-je déclarer cette fonction de manière globale ?

Answer 1

Vous avez deux options, l'ajouter à la window pour le rendre global :

window.getList = function(url, gkey){ 
    // etc...
}

ou le déplacer de l'intérieur du gestionnaire de l'événement "document prêt" vers la portée globale :

$(document).ready(function() {  
    alert(getList('http://www.youtube.com/watch?v=dm4J5dAUnR4', "v"));
});  
var getList = function(url, gkey){  

    var returned = null;  
    if (url.indexOf("?") != -1){  
      var list = url.split("?")[1].split("&"),  
              gets = [];  

      for (var ind in list){  
        var kv = list[ind].split("=");  
        if (kv.length>0)  
            gets[kv[0]] = kv[1];  
    }  

    returned = gets;  

    if (typeof gkey != "undefined")  
        if (typeof gets[gkey] != "undefined")  
            returned = gets[gkey];  

    }  

        return returned;  

};  

Vous pouvez également lire cette question sur l'utilisation var functionName = function () {} vs function functionName() {} y cet article sur la portée des variables.

Answer 2

Une autre option encore consiste à suspendre la fonction à l'objet jQuery lui-même. De cette façon, vous évitez de polluer davantage l'espace de nom global :

jQuery.getlist = function getlist(url, gkey) {
  // ...
}

Ensuite, vous pouvez y accéder avec "$.getlist(url, key)".

Answer 3

Déclarer getList() en dehors de la fonction ready() .

var getList = function(url, gkey){
        var returned = null;
        if (url.indexOf("?") != 
....
....
...
};

Maintenant, le getList fonctionnera n'importe où dans le code :

$(document).ready( function() {
alert(getList('http://www.youtube.com/watch?v=dm4J5dAUnR4', "v"));
});

Le problème était la portée de la fonction getList(.).

Answer 4

Il suffit de la définir comme une fonction régulière au début de votre script :

<script type="text/javascript">
    function getlist(url, gkey){  
        ...
    }
</script>

Answer 5

Pour la déclarer comme une fonction globale, il suffit de se débarrasser de tous les éléments spécifiques à jQuery. Quelque chose comme ça :

function getList(url, gkey) {
    var returned = null;
    if (url.indexOf("?") != -1){
    var list = url.split("?")[1].split("&"), gets = [];
    for (var ind in list){
        var kv = list[ind].split("=");
        if (kv.length>0) {
            gets[kv[0]] = kv[1];
        }
    }

    returned = gets;

    if (typeof gkey != "undefined") {
        if (typeof gets[gkey] != "undefined") {
            returned = gets[gkey];
        }
    }

    return returned;
}

Et ensuite vous devriez pouvoir l'appeler de n'importe où.