Passez des paramètres supplémentaires à jQuery chaque () rappel

Je travaille sur une application qui présentera des sondages à l'utilisateur. Le balisage ressemble à ceci:

<body> <div class="question" id="q1"> Question 1 </div> <div class="question" id="q2"> Question 2 </div> <!-- etc --> </body> 

Je veux construire les objets JavaScript du DOM à l'aide de jQuery, alors, dans le constructeur Survey je parcours le jeu jQuery à l'aide de la méthode each() . Le problème est que, dans la fonction de rappel, je ne parviens pas à obtenir une référence à l'objet Survey pour ajouter chaque objet Question au tableau Survey.questions . Comment obtenir une référence à l'objet Survey ? Existe-t-il un moyen de passer un paramètre supplémentaire (par exemple, une référence à l'objet Survey ) à la fonction callback?

 function Survey() { this.questions = new Array; $('.question').each(function(i) { (/* Survey object */).questions.push(new Question(this)); }); } function Question(element) { this.element = $(element); } 

Vous devriez être en mesure de créer une référence à votre sondage avant de faire itérer sur les questions.

 function Survey() { this.questions = new Array(); var survey = this; $('.question').each(function(i) { survey.questions.push(new Question(this)); }); } function Question(element) { this.element = $(element); } var survey = new Survey(); $.each(survey.questions, function() { $("ul").append("<li>" + this.element.text() + "</li>"); }); 

Exemple de travail sur jsfiddle

Bien que cela ne soit peut-être pas une réponse pertinente, mais comme la question est de savoir comment passer le paramètre à jQuery chaque fonction.

Première approche: Utilisation de la fonction partielle – plus sur ceci et de la bibliothèque de fermeture

Jsfiddle :

 var param = 'extra-param'; var partial = function(fn, var_args) { var args = Array.prototype.slice.call(arguments, 1); return function() { // Clone the array (with slice()) and append additional arguments // to the existing arguments. var newArgs = args.slice(); newArgs.push.apply(newArgs, arguments); return fn.apply(this, newArgs); }; }; $(['joe','james','rick','kirk']).each(partial (function (index,value) { alert(arguments.length); alert(arguments[0]); },param)); 

La deuxième approche est

$ .each peut prendre 2 paramètres d' Index et d' Element (ce qui peut également être désigné comme this ) OU si vous n'avez pas besoin d' Index vous pouvez passer Array comme argument à $ .each et l'élément peut être considéré comme ceci

ATTENTION: args est uniquement pour usage interne – par jQuery

 // Execute a callback for every element in the matched set. // (You can seed the arguments with an array of args, but this is // only used internally.) each: function( callback, args ) { return jQuery.each( this, callback, args ); }, 

Ce qui appellera each: function( obj, callback, args )

Puis appeler callback.apply( obj[ i ], args ); Si vous passez le tableau comme argument, sinon callback.call( obj[ i ], i, obj[ i ] ) ;

Notez la différence de candidature et appelez

Exemple de code: http://jsfiddle.net/dekajp/yA89R/1/

 var param = 'rick'; $(['joe','james','rick','kirk']).each(function (arg1 , arg2 ,arg3) { //alert('[this: '+this +'] [arg1: '+ arg1 +'] [arg2:'+arg2+'] [param:'+param+']'); },['hello 1','hello 2','hello 3']); 

Pour référence jQuery Chaque code version 1.9

 // args is for internal usage only each: function( obj, callback, args ) { var value, i = 0, length = obj.length, isArray = isArraylike( obj ); if ( args ) { if ( isArray ) { for ( ; i < length; i++ ) { value = callback.apply( obj[ i ], args ); if ( value === false ) { break; } } } else { for ( i in obj ) { value = callback.apply( obj[ i ], args ); if ( value === false ) { break; } } } // A special, fast, case for the most common use of each } else { if ( isArray ) { for ( ; i < length; i++ ) { value = callback.call( obj[ i ], i, obj[ i ] ); if ( value === false ) { break; } } } else { for ( i in obj ) { value = callback.call( obj[ i ], i, obj[ i ] ); if ( value === false ) { break; } } } } return obj; }, 

J'ai rencontré un problème similaire. Passer le paramètre à chaque fonction:

 var param1 = "one"; var param2 = "two"; var params = [ param1, param2 ]; $( '#myTable > tbody > tr' ).each(function( index ) { var param1back = params[0]; var param2back = params[1]; },params); 
 //Create extra data var dataArray = ["A", "B", "C"]; //Send default arguments from jQuery's each (index and item) along //with our new data argument to a named function handler. $("#myList").children().each(function(jqIndex, jqItem) { listItemsHandler(jqIndex, jqItem, dataArray[jqIndex]); }); //Named function handler accepting 3 arguments. function listItemsHandler(index, item, data) { console.log(index + " " + item + " " + data); } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ol id = "myList"> <li>First</li> <li>Second</li> <li>Third</li> </ol>