jquery - 使用jquery提交表单不起作用

Question

我正在使用 jquery 渲染部分表单

$('.actCell').click(createClick);
function createClick() {
    var create = $(this).attr("create");
    $('#'+create).slideToggle();
    $.get('/policies/new', function(data) {

    });
}

然后还有另一个提交表单但提交不起作用的功能（它缺少提交功能并且正在执行rails方式）

$("#new_policy").submitWithAjax();
jQuery.fn.submitWithAjax = function () {
    this.submit(function () {
        $('#createPolicy').slideToggle();
        $.post(this.action, $(this).serialize(), null, "script");
        return false;
    })
    return this;
};

如果我停止使用呈现部分形式的函数，上述函数将起作用。任何帮助都会非常有帮助。谢谢

Answer 1

由于表单是动态的，您应该使用委托的事件处理程序：

jQuery.fn.submitWithAjax = function () {
    $(document).on('submit', this.selector, function () {
        $('#createPolicy').slideToggle();
        $.post(this.action, $(this).serialize(), null, "script");
        return false;
    });
    return this;
};

在插件内部，this.selector是作为字符串传递的选择器，在这种情况下#new_policy，使用它on()会将事件委托给文档并过滤选择器。

Answer 2

我终于想通了。这就是我正在做的事情。

$(document).on('submit', 'form#new_policy', function() {
         $('#createPolicy').slideToggle();
             $.post(this.action, $(this).serialize(), null, "script");
             return false;

     });