在jQuery中通过AJAX提交表单

Question

我正在使用以下jQuery代码通过AJAX提交表单。

jQuery('form.AjaxForm').submit( function() {            
        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            dataType: 'json',
            data    : $(this).serialize(),
            success : function( data ) {
                        alert('Submitted')
                      },
            error   : function( xhr, err ) {
                        alert(''Error);     
                      }
        });    
        return false;
    });

代码完美运行，没有ajax。 但是，如果我通过Ajax加载表单，则无法正常工作。 我认为这是因为JavaScript加载后通过ajax加载了表单。

有什么办法吗？

Answer 1

如果使用jQuery
1.7+，则可以尝试使用.on（）委托事件并绑定到具有相同类的所有将来的表单。尝试查找没有动态插入的最接近的父代，而不是$（document）。

$(document).on('submit', 'form.AjaxForm', function() {            
        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            dataType: 'json',
            data    : $(this).serialize(),
            success : function( data ) {
                         alert('Submitted');
            },
            error   : function( xhr, err ) {
                         alert('Error');     
            }
        });    
        return false;
    });