jQuery each () функция для добавления элемента к каждой форме на основе ее идентификатора - PullRequest
0 голосов
/ 01 июля 2011

Я пытаюсь перебрать список форм, отображаемых на странице, и добавить элемент к каждой из них в зависимости от их идентификатора.

Я думал сделать что-то подобное, но это не похожечтобы работать:

var number_of_forms = $('.common_form_class').length;

if (number_of_forms > 1) {
    $('.common_form_class').each(function() {
        var identity = $(this).attr('id');
        $.getJSON("/token.php?key=" + identity, function(data){
            $(this).append('<input type="hidden" class="token" name="token" value="'+data.token+'" />');
        });
    });
} else {
    var identity = $('.common_form_class').attr('id');
    $.getJSON("/token.php?key=" + identity, function(data){
        $('.common_form_class').append('<input type="hidden" class="token" name="token" value="'+data.token+'" />');
    });
}

Я понимаю, что не могу ссылаться на форму в цикле each (), используя $ (this), но кто-нибудь знает, как мне этого добиться?

Ответы [ 2 ]

2 голосов
/ 01 июля 2011

Я переписал ваш код, используя лучший стиль, пожалуйста, проверьте:

$('.common_form_class').each(function() {
    var $this = $(this);
    $.getJSON("/token.php", {key: $this.attr('id')}, function(data){
        $this.append($("<input/>", {type: "hidden", "class": "token", name: "token"}).val(data.token));
    });
});
2 голосов
/ 01 июля 2011

Это работает, только если у вас более одной формы. Если есть только одна форма, которую вы пытаетесь использовать $(this) без цикла each, то this будет window объектом.

Кроме того, использование $(this) внутри обратного вызова не работает, потому что обратный вызов выполняется позже, вне области действия цикла. Сохраните ссылку на форму в локальной переменной, чтобы она была включена в замыкание для функции обратного вызова.

Вы можете просто зациклить, даже если есть только одна форма:

$('.common_form_class').each(function() {
  var frm = $(this);
  $.getJSON("/token.php?key=" + frm.attr('id'), function(data){
    frm.append('<input type="hidden" class="token" name="token" value="'+data.token+'" />');
  });
});

Или лучше использовать jQuery:

$('.common_form_class').each(function(i, frm) {
  $.getJSON("/token.php", { key: frm.attr('id') }, function(data){
    frm.append($('<input/>', { type: 'hidden', 'class': 'token', name: 'token' }).val(data.token));
  });
});

Примечание. Используя метод val для установки значения вместо его конкатенации в HTML-коде, вам не нужно беспокоиться о символах, которые могут нарушить HTML-код.

...