jQuery: выполнить функцию для соответствующих элементов, возвращаемых через Ajax - PullRequest
1 голос
/ 23 февраля 2012

Этот селектор jQuery соответствует HTML-форме Rails 3 для новой модели: $ ('form [id ^ = "new _"]')

Мне бы хотелось, чтобы простая функция фокусировки запускалась каждый разсоответствующая форма загружается.Иногда формы загружаются через простой GET, а также через Ajax.В последнем случае возвращаемое содержимое может быть либо HTML, либо экранированным JS.

Я надеялся, что jQuery сможет сопоставить все случаи с помощью селектора, .on () и события «load», ноЯ не могу заставить это работать для ЛЮБОГО случая.Код:

$(document).ready(function() {
    $('form[id^="new_"]').on("load", function(){
        console.log("Matched!")
    });
})

Есть идеи?


Спасибо, юстиция.Боюсь, я не смог заставить ваш код работать.Я использую следующий обратный вызов с новым настраиваемым событием, определенным вне его, как показано, и я не думаю, что $ ('form') вызывает событие.

$('.shows-children').bind('ajax:success', function(evnt, data, status, xhr){
    var boxSelector = '#' + $(this).data("shows");
    $(boxSelector).html(xhr.responseText);
    $('form').trigger('customevent');
});

$(document).on('customevent','form[id^="new_"]', function(){
    console.log('Matched!')
});

(я удивленкажется более сложным, чем ожидалось, действие jQuery на HTML, возвращаемое в ответе Ajax.)

1 Ответ

0 голосов
/ 23 февраля 2012
$(document).on("change","form[id^=\"new_\"]" function(){
        console.log("Matched!")
    });

Для делегирования вы хотите делегировать исходный селектор родителю, так как событие всплывет.

Однако нагрузка НЕ ​​всплывает. В этом случае изменения может быть достаточно, но оно сработает и попытается проверить, действителен ли делегат при каждом изменении документа.

Я бы тогда предложил создать пользовательское событие после загрузки AJAX для формы.

Пример:

$(document).on("customevent","form[id^="new_"]" function(){
    console.log("Matched!")
    $.ajax(url, function(response){
        //success
       $(document).append(response);
       $('form').trigger('customevent');
    });
});

НТН

...