Question

我正在使用jQuery AJAX重新加载DIV内容而不刷新整个页面。新结果将显示在DIV中。

现在问题是这些结果还有使用jQuery AJAX的按钮。当AJAX加载DIV内容时，这些按钮不能再次使用AJAX，因为AJAX没有重新加载或类似的东西（？）。它只在重新加载整个页面时才能正常工作，但这不是我想要的。

如何在重新加载DIV内容时再次使用AJAX脚本？

jQuery AJAX脚本添加结果并仅重新加载div结果：

$(document).ready(function(){
    $('#form_disabled_date').submit(function(e){
        e.preventDefault();
        var form = $(this);
        var result = $('#disabled_date');
        var post_url = form.attr('action');
        var post_data = form.serialize();
        $.ajax({
            type: 'POST',
            url: post_url,
            data: post_data,
            success: function(msg) {
                $(result).fadeOut(500, function(){
                    result.load(document.URL +  ' #disabled_date').fadeIn();
                });
            }
        });
    });
});

HTML：

<div id="disabled_date">
   result1 (delete), result2 (delete), result3 (delete) <-- results loaded with PHP
</div>

用于提交删除按钮的jQuery AJAX，仅重新加载包含结果的div：

$(document).ready(function(){

$('.form_delete_disabled_date').submit(function(e){

    e.preventDefault();
    var form = $(this);
    var result = $('#disabled_date');
    var post_url = form.attr('action');
    var post_data = form.serialize();

    $.ajax({

        type: 'POST',
        url: post_url,
        data: post_data,
        success: function() {

            $(result).fadeOut(500, function(){
                result.load(document.URL +  ' #disabled_date').fadeIn();
            });

        }

    });

});

});

结果由id：“form_disabled_date”的表单添加。使用上面的JavaScript代码重新加载div“disabled_date”。删除按钮有类：“form_delete_disabled_date”。

如何重新加载div内容并仍然使用未重新加载的jQuery？

解：我不得不更改以下代码：

$(document).ready(function(){

  $('.form_delete_disabled_date').submit(function(e){
    //code
  });
});

要：

$(document).on('submit', '.form_delete_disabled_date', function(e){
    //code
});

现在，当AJAX重新加载div而不是页面时，submit事件将绑定到“form_delete_disabled_date”。新结果现在可以使用代码。

使用AJAX重新加载DIV内容并仍然再次使用AJAX，而不重新加载

0 个答案: