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

Question

J'ai une fonction qui dépouille le id de youtube d'une URL. Je veux ensuite utiliser cette fonction 10 fois par page (dans la boucle wordpress).

La fonction fonctionne très bien lorsque je la charge dans l'URL de mes balises de script de fonction, mais lorsque je lance un nouveau jeu de balises de script dans la boucle, cela ne fonctionne pas.

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

Donc, c'est 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 quand j'essaie d'utiliser ce quelque part 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, parce que son pas. Suis-je capable de déclarer «globalement» cette fonction?

Answer 1

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

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

ou mouvement de l'intérieur du gestionnaire d'événement de document prêt dans 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 this question sur l'utilisation de var functionName = function() {} par rapport à function functionName() {} et this article sur la portée variable.

Answer 2

Il suffit de le définir comme une fonction régulière en haut de votre script:

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

Answer 3

getList déclare() en dehors de la fonction prêt() ..

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

Maintenant, le getList fonctionnera partout 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 getList (.) fonction.

Answer 4

Encore une autre option consiste à suspendre la fonction de l'objet jQuery lui-même. De cette façon, vous éviter de polluer l'espace de noms global plus loin:

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

Ensuite, vous pouvez obtenir à avec « .getlist de $ (url, clé) »

Answer 5

Pour déclarerons comme fonction globale, juste obtenir débarrasser de tous les bits spécifiques de jQuery. Quelque chose comme ceci:

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 puis vous devriez pouvoir l'appeler de n'importe où.

Answer 6

Vous pouvez simplement ajouter votre fonction dans la variable $.fn:

function ($) { 

    $.fn.getList = function() { 
     // ... 
    }; 

}(jQuery)); 

Exemple d'utilisation:

$.getList(); 

Voici ce que vous généralement faire en créant un Basic Plugin pour jQuery.