提交事件未捕获提交类型输入

submit event not capturing submit type input

本文关键字:提交 类型 输入 事件      更新时间:2023-09-26

我有一个Ajax GET请求,如下所述

$(document).ready(function() {
    $('#comment-edit-form').submit(function() {
        $.ajax({
            type: $(this).attr('method'),
            url: '/comments/edit/' + $(this).attr('comment_pk') + '/',
            data: $(this).serialize(),
            success: function(data){}
        });
        return false;
    });
});

形式是这样的

<form method="get" id="comment-edit-form">
..
<input class="btn btn-primary" type="submit" name="preview" value="Preview">
<input class="btn btn-primary" type="submit" name="submit" value="Submit">
</form>

在这个表格中,我有两个不同的提交按钮!每个按钮都有不同的操作!

我跟踪的 GET 请求 URL 如下所示

?input1=1&input2=2...

我期待?input1=1&input2=2&submit=?input1=1&input2=2&preview=

为什么我无法在请求中观察到"提交"或"预览"名称?

这是因为jQuery只序列化具有未submit,button, image, file or reset输入类型的节点类型input, select, textarea and keygen

查看 jQuery 源代码,您可以知道表单元素的输入类型是根据以下正则表达式检查的:

 /^(?:submit|button|image|reset|file)$/i

此检查在代码中由.serialize调用的.serializeArray


对于感兴趣的读者 - 这是完整的过滤器:

return this.name &&  // has a name
       !jQuery(this).is(":disabled") &&  // is not a disabled input
       rsubmittable.test(this.nodeName) && // is either input, select,textarea or keygen 
       !rsubmitterTypes.test(type) && // the test explained above
       (this.checked || !manipulation_rcheckableType.test(type)); // checked