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

时间:2018-02-06 23:22:22

标签: javascript jquery ajax

好的,我使用砌体脚本在网格中排列图像,我把它放在外部脚本中的函数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调用,但我真的不明白在这种情况下如何做。

1 个答案:

答案 0 :(得分:2)

您的.click()处理程序仅在文档准备好时绑定DOM中存在的元素。由于您需要在ajax调用之后绑定到元素,因此请使用.on()

Keep Calm and Call .on

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