Передайте дополнительные параметры в обратный вызов jQuery each () - PullRequest
Новая
       1

Передайте дополнительные параметры в обратный вызов jQuery each ()

38 голосов
/ 17 февраля 2011

Я работаю над приложением, которое будет представлять пользователю опросы.Разметка выглядит примерно так: 

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

Я хочу создать объекты JavaScript из DOM, используя jQuery, поэтому в конструкторе Survey я обхожу набор jQuery, используя метод each().Проблема в том, что в функции обратного вызова я не могу получить ссылку на объект Survey, чтобы добавить каждый объект Question в массив Survey.questions.Как получить ссылку на объект Survey?Есть ли способ передать дополнительный параметр (например, ссылку на объект Survey) в функцию обратного вызова? 

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

function Question(element) {
    this.element = $(element);
}

Ответы [ 4 ]

32 голосов
/ 17 февраля 2011

Вы должны иметь возможность создать ссылку на свой опрос, прежде чем перебирать вопросы. 

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>");
});

Рабочий пример для jsfiddle

18 голосов
/ 07 июля 2013

Хотя это может быть неуместным ответом, но поскольку вопрос заключается в том, как передать параметр в jQuery для каждой функции.

Первый подход: использование частичной функции - подробнее об этом и из библиотеки закрытий

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));

Второй подход

$. каждая функция может принимать либо 2 параметра Index и Element (которые также могут упоминаться как this) ИЛИ если вам не нужен Index, тогда вы можете передать Array в качестве аргумента $ .eachи элемент может называться следующим:

ВНИМАНИЕ: args предназначен только для внутреннего использования - 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 );
},

, который будет вызывать each: function( obj, callback, args )

затем вызовите callback.apply( obj[ i ], args );, если вы передадите массив в качестве аргумента, в противном случае callback.call( obj[ i ], i, obj[ i ] );

обратите внимание на разницу применения и вызовите

Пример кода: 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']);

Для справки jQuery Каждый код версии 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;
    },
9 голосов
/ 23 апреля 2015

Я столкнулся с подобной проблемой. передать параметр каждой функции: 

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);
1 голос
/ 20 мая 2016 

//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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...