如何在ajax加载后重新绑定jquery调用？

Question

好的，所以我使用石工脚本将图像排列在网格中，并将其放置在外部脚本中的arange_images（）函数中。

在我的主脚本中，我打电话

$(document).ready(function(){
    arange_images();      //<- Works lovely
});

然后，我决定用ajax加载其他图像。 之后，我的图像停止排列。

function get_img(section_id) {
$.ajax({
    type: 'GET',
    url: './db/get_img.php',
    data: {
        section_id: section_id
    },
    success: function (data) {

        var data_parsed = JSON.parse(data);
        var images = '<div class="grid-sizer"></div><div class="gutter-sizer"></div>';

        $.each(data_parsed, function (i, picture) {
            images += '<div class="member">';
            images += '    <img src="img/pictures/' + picture.path + '" alt="' + picture.alt + '"/>';
            images += '</div>';
        });

        $('.grid').html(images);

        arange_images();       //<- Does not work

    }

 });
}





$('.section_selector').click(function () {
        get_img($(this).attr('data-section_id'));
        arange_images();           //<- Does not work either
    });

搜索类似的错误对我没有帮助。 在ajax之后，jquery的大多数问题都由.click替换为.on（'click'）。 我读到我需要重新绑定jquery调用，但是我真的不明白在这种情况下该怎么做。

Answer 1

您的.click()处理函数将仅绑定文档准备就绪时DOM中存在的元素。 由于您需要在ajax调用之后绑定到元素，因此请使用.on（） 。

保持冷静并打电话给

$(document).on('click', '.section_selector'), function () {
    get_img($(this).attr('data-section_id'));
});