Как добавить обработчик событий с аргументами массиву элементов в JavaScript?

У меня есть процесс с тремя шагами, который совершенно уверен на JavaScript и Ajax, чтобы загрузить данные и анимировать процесс от одного шага до следующего. Еще более того переход (вперед и назад) между шагами анимирован :-(. Как успех пользователя через привязку к процессу кажутся показывающими текущий шаг и предыдущие шаги. Если они нажимают на предыдущий шаг, то он забирает их к предыдущему шагу.

Прямо сейчас весь процесс (вперед и назад) работает правильно, если Вы начинаете на шаге 1, но если Вы переходите прямо к шагу 3 затем, привязки для шага 1 и шага 2 также выполняют то же действие как шаг 3.

Это - часть кода, что циклы через все шаги до текущего шага, что пользователь шел бы и отображает каждую привязку в свою очередь и присваивает соответствующую функцию событию щелчка:

for (var i = 0; i < profile.current + 1; i++) {
    if ($('step_anchor_' + i).innerHTML.empty()) {
        var action = profile.steps[i].action;
        var dao_id = profile.steps[i].dao_id;

        $('step_anchor_' + i).innerHTML = profile.steps[i].anchor;
        $('step_anchor_' + i).observe('click', function(){
            pm.loadData(action, dao_id, true);
        });

        Effect.Appear('step_anchor_' + i, {
            duration: 1,
            delay: (down_delay++)
        });
    }
}

Я знаю, что проблема заключается в том, как это, действие и dao_id параметры передаются в. Я также попытался передать profile.steps [я] .action и profile.steps [я] .dao_id, но в этом случае оба профиля и я или по крайней мере я отсутствую объем.

Как я делаю его так, чтобы я мог присвоить параметры для действия и dao_id правильно для каждого шага? (Если это имеет какое-либо значение, мы используем Prototype и Scriptaculous),

7
задан Brian Tompsett - 汤莱恩 21 July 2019 в 18:16
поделиться

2 ответа

Ваша цепочка объема закрытия вызывает Ваши проблемы. Путем объявления встроенной функции-обработчика Вы создали закрытие. Очевидно, Вы сделали это для использования в своих интересах цикла.

Однако, так как Вы создали закрытие, Вы играете правилами обзора данных закрытия. Они управляют государством, что локальные переменные в родительской функции остаются активными и доступными, пока закрытие существует.

Вы пытаетесь передать и затем использовать "действие" и "dao_id" к Вашему закрытию, но Вы передаете ссылки сюда, не значения. Таким образом, когда Ваши закрытия (обработчики) называют, они используют значение, что ссылка была в последний раз присвоена. В Вашем случае, обработчике Шагов 3.

Правила обзора данных закрытия путают достаточно, но Вы можете также быть смущены тем, что "действие" и "dao_id" все еще живы даже при том, что блок цикла закончил выполняться. Ну, в JavaScript нет такой вещи как область действия блока. После того как Вы объявляете переменную, это доступно, пока конец функции или до не является удаленным. Какой бы ни на первом месте.

Однако необходимо повредить цепочку объема. Вот два способа сделать это:

Попробуйте это:

for (var i = 0; i < profile.current + 1; i++) {
    if ($('step_anchor_' + i).innerHTML.empty()) {
        var action = profile.steps[i].action;
        var dao_id = profile.steps[i].dao_id;

        $('step_anchor_' + i).innerHTML = profile.steps[i].anchor;
        $('step_anchor_' + i).observe('click', function(a, b){
                return function(){pm.loadData(a, b, true)};
        }(action, dao_id));

        Effect.Appear('step_anchor_' + i, {
                duration: 1,
                delay: (down_delay++)
        });
    }
}

Или это:

function createHandler(action, dao_id) {
    return function(){pm.loadData(action, dao_id, true);};
} 

/* snip - inside some other function */
for (var i = 0; i < profile.current + 1; i++) {
    if ($('step_anchor_' + i).innerHTML.empty()) {
        var action = profile.steps[i].action;
        var dao_id = profile.steps[i].dao_id;

        $('step_anchor_' + i).innerHTML = profile.steps[i].anchor;
        $('step_anchor_' + i).observe('click', createHandler(action, dao_id));
        Effect.Appear('step_anchor_' + i, {
                duration: 1,
                delay: (down_delay++)
        });
    }
}
7
ответ дан 7 December 2019 в 07:52
поделиться

Во-первых, помните свой объем выполнения в событии щелчка. Это ключевое слово в том контексте относится к нажимаемому элементу. Есть ли какой-либо способ, которым можно определить dao_id от элемента, на который нажимают?

0
ответ дан 7 December 2019 в 07:52
поделиться
Другие вопросы по тегам:

Похожие вопросы: