在提交动态生成的表单时，查找单击了哪个提交按钮

Question

我有多个由模板引擎在运行时动态生成的表单，为了在提交时生成 ajax 请求，我使用了 on 方法来委托事件。

$("#friendRequestsList").on("submit", "[id^=friendReqResponse-form]", function(){
    var form = this;
    $(form).ajaxSubmit({
        url:'URL',
        type:'post',
        dataType: 'json',
        success: function(data) {
            DO SOMETHING
        }

    });
    return false;
});

表单有两个提交按钮，我需要检测点击了哪个按钮并将此信息传递给 ajax 请求。但是，我很难知道单击了表单中的哪个提交输入，因为它们也是动态生成的。想法？

Answer 1

希望对您有所帮助:

$("#friendRequestsList").on("submit", "[id^=friendReqResponse-form]", function(){
     var submit1 = $(this).attr('value');

     var formData = new FormData();
     formData.append('submit1', submit1);

     $.ajax({
        url:'URL',
        type:'post',
        data:formData,
        dataType: 'json',
        success: function(data) {
            DO SOMETHING
        }

    });
    return false;
});

Answer 2

根据 Connors 关于使用点击事件而不是提交的建议，我已经成功地获得了这样的提交按钮：

 $("#friendRequestsList").on("click", "[id^=submit1], [id^=submit2]", function(e) {
    var input = this;
    var form = $(input).parent();

    $(form).ajaxSubmit({
        url:'URL',
        type:'post',
        dataType: 'json',
        success: function(data) {
            DO SOMETHING
        }

    });
    e.preventDefault()
});

当然，如果我的表单有输入字段，这将不会很好地工作，因为它不会在通过按键 Enter 提交表单时触发。此外，您仍然需要将输入标识信息附加到 ajax 请求。

我通过添加

做到了这一点

 data: {submit:input.value},

到ajax提交设置

在提交动态生成的表单时，查找单击了哪个提交按钮

on submit of dynamically generated form, find which submit button was clicked

javascript

ajax

jquery

jquery-events