Comment appeler une variable qui appartient à une autre fonction

Résolu/Fermé

DADYY87 - 6 mai 2021 à 16:14
Totox - 7 mai 2021 à 14:50

Bonjour,

Je n'ai pas trouvé d'idée pour appeler une variable qui est initialisée dans une autre fonction. En faite ce que je souhaite faire est sous cette forme:

$(document).off("click");
                $(document).on("click", "a.eff0", function (){
                    const parent = $(this).closest('.row');
                    const parent2 = $(this).closest('.fileUpload');
                    parent.find('.upl').html('Parcourir');
                    parent.find('.icon2').attr('src', 'https://image.flaticon.com/icons/svg/136/136549.svg');
                    $(document).off("click");
                    $(document).on("click", "a.eff0", function (){
                        $(this).closest(".uploadDoc").remove();
                    });
                });

sauf que j'aimerai remplacer les "a.eff0" par une variable mais qui a été appelé dans cette fonction uniquement :

$(".btn-new").on('click', function (){
        var i = 0;
        $("#change-class").each(function (){
            i++;
        });

        var name = 'eff' + i;
        $("#uploader2").append('<div class="row uploadDoc"><div class="col-sm-4 order-1 order-sm-0"><div class="docErr">Veillez upload au format pdf, jpg, jpeg, png</div><!--error--><div class="fileUpload btn btn-orange"> <img src="https://image.flaticon.com/icons/svg/136/136549.svg" class="icon2"><span class="upl" id="upload">Parcourir</span><input type="file" name="file[]" class="upload up" accept="image/png, image/jpeg, .pdf" id="up" onchange="readURL(this);" required/><div class="invalid-feedback">Document obligatoire</div></div></div><div class="col-sm-1 order-2 order-sm-1"><div class="pos_croix"><a href="#" id="change-class" class="' + name +'"><i class="fas fa-times fa-xs" style="color:red;"></i></a></div></div><div class="col-sm-6 order-0 order-sm-2"><input type="text" class="form-control" name="test[]" placeholder="Veuillez preciser le document que vous ajoutez" required pattern="^[A-Za-z -]+$"><div class="invalid-feedback">Veuillez saisir le document que vous souhaitez ajouter.</div></div></div>');

        $(document).on("click", "a."+name, function (){
            $(this).closest(".uploadDoc").remove();
        });

    });

En gros la variable "name" n'est plus reconnu et la 1ère partie de mon code je ne peux pas la déplacer au même endroit où se trouve ma variable car ce que je fais ne va plus fonctionner... Je ne sais pas quelle méthode employer...

A voir également:

Comment appeler une variable qui appartient à une autre fonction
A qui appartient ce numéro - Guide
Fonction si et - Guide
Appeler en privé - Guide
A qui appartient ce 06 gratuit - Forum Mobile

2 réponses

Réponse 1 / 2

jordane45 Messages postés 38364 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 30 décembre 2024 4 720
Modifié le 6 mai 2021 à 16:54

Bonjour,

Je t'invite fortement à aller regarder (te former ) la portée des variables en javascript.

Donc, ton code, devrait ressembler à ça

// déclaration en dehors de toute fonction = portée GLOBALE
var name = null;

$(".btn-new").on('click', function (){
     /* INUTILE   .. pas besoin de faire de boucle
     var i=0;
     $("#change-class").each(function (){
            i++;
        });
      */ 
      var i =  $("#change-class").length; // remplace la boucle : https://api.jquery.com/length/

        name = 'eff' + i;
        $("#uploader2").append('<div class="row uploadDoc"><div class="col-sm-4 order-1 order-sm-0"><div class="docErr">Veillez upload au format pdf, jpg, jpeg, png</div><!--error--><div class="fileUpload btn btn-orange"> <img src="https://image.flaticon.com/icons/svg/136/136549.svg" class="icon2"><span class="upl" id="upload">Parcourir</span><input type="file" name="file[]" class="upload up" accept="image/png, image/jpeg, .pdf" id="up" onchange="readURL(this);" required/><div class="invalid-feedback">Document obligatoire</div></div></div><div class="col-sm-1 order-2 order-sm-1"><div class="pos_croix"><a href="#" id="change-class" class="' + name +'"><i class="fas fa-times fa-xs" style="color:red;"></i></a></div></div><div class="col-sm-6 order-0 order-sm-2"><input type="text" class="form-control" name="test[]" placeholder="Veuillez preciser le document que vous ajoutez" required pattern="^[A-Za-z -]+$"><div class="invalid-feedback">Veuillez saisir le document que vous souhaitez ajouter.</div></div></div>');

        $(document).on("click", "a."+name, function (){
            $(this).closest(".uploadDoc").remove();
        });

    });

Réponse 2 / 2

DADYY87
7 mai 2021 à 12:15

Bonjour Jordane45,

J'ai bien lu et compris le lien que vous m'aviez consulté de regarder et vraiment merci beaucoup ! Je pensais pas que le Javascript était un langage autant différent des autres langages. Quand j'essayais de mettre ma variable ailleurs dans mon éditeur de texte je l'avais sous forme rayée du coup je pensais que ce n'était pas fonctionnel...

En tout cas merci !

Totox
Modifié le 7 mai 2021 à 15:08

JavaScript est très fonctionnel comme langage(comme beaucoup de langage scripts non typé il me semble) et JQuery encore plus.
D'a&illeurs en JS il n'y a pas de vrai différence entre les fonctions et les objets, c'est un paradigme objet plus qu'un vrai langage objet et qui utilisait beaucoup le prototypage pour ça. Maintenant il y a de meilleures façons de faire avec l'évolution du langage.

Le mieux c'est souvent le passage de variable (caractéristique de la prog fonctionnelle) en chaînage:

function maFunction1(value1){
//-- traitement

return resultatTraitement;
}

function maFonction2(value2){
//-- traitement

return resultatTraitement;


}

var val1='une valeur';

var traitement = maFunction2(maFunction(val1));
//-- JQuery est complétement basé là dessus avec la notion d'objet en plus

Les variables crées avec "var" sont disponibles dans l'objet window (contrairement aux variables assignées avec "let")mais il faut tenir compte de la temporal dead zone(tdz) qui fait qu'une fois une fonction "exécutée" son contenu n'existe plus.
C'est l'équivalent du ramasse miettes dans les langages compilés comme JAVA ou de l'attribution de mémoire avec C++ et autres.
Et comme les threads n'existent pas vraiment(il n'y a que l'approche événementielle pour ça) pas possible d'avoir accès aux variables internes même définies en globales(et il n'existe pas de variables super globales donc il faut passer par une externilisation si on veut vraiment les utiliser sur la durée et plusieurs pages comme par exemple avec la méthode AJAX o en mettant la valeur dans l'URL(en GET ou en écriture manuelle) ou directement dans le HTML souvent en "planqué" ou avec un datatype HTML).
Sinon oui var en global dans l'objet window reste accessible du moment qu'on reste dans le contexte d’exécution(une page).

En même temps les défauts ou problèmes de JS en font ses qualités, pas pour rien que Microsoft l'à élu meilleur langages actuel il y a quelques années(à l'époque de la norme JS6 et >). C'est aussi pour ça que beaucoup de développeurs détestent ce langage et qu'ils existent des tas de bibliothéques qui vont compenser les problèmes(comme CoffeeScript et autres qui rajoutent une sécurité pour le typage ou le MVC mais qui bien sûr sont à utiliser dans un contexte particulier)

ça permet les closures et autres astuces totalement fonctionnelles(comme la mutation des variables lors de leur traitement) et on peut se passer du singleton (dans certains cas) pour assurer la sécurité d'un bloc et son unicité parce que le code script contrairement à un langage compilé va faire exister le bloc de code(exemple une fonction anonyme) uniquement au moment de son utilisation.

Discussions similaires

"L'indice n'appartient à la sélection" + VBA

je veut créer des codes

Remplir une cellule (texte) en fonction d'une autre (texte).

comment trouver un numéro de mobile en SUISSE

rechercher numéro potable annuaire inversé gratuit Belgique