jquery form.submit()触发处理程序，但不触发实际提交

Question

我有一个带有提交按钮和处理程序的表单。处理程序进行一些验证，如果验证不酷，则执行preventDefault()。

我有第二个按钮在我的表格上提交未经验证。我的思维逻辑是:这个按钮将添加一个类指示，而不是验证，然后触发提交。submit事件将始终检查它是否应该验证。

一些代码：

    //Add handler for no-validation submit
    $('#button-no-falco').click(function() {
        $('#form').addClass('no-falco');
        $('#form').submit();
    });


    $('#form').submit(function(e) {
        //If form has no-falco, don't validate.
        if ($(this).hasClass('no-falco')) {
            console.log("Skipping validation. Just submit.");
            return;
        }

        //Validation code

        e.preventDefault();


    });

一些HTML：

<form role="form" method="post" action="{{action_url}}" name="edit-object">
    <!-- bunch of inputs -->
    <button type="submit" id="submit" class="btn btn-default">Save!</button>
    <button type="button" id="button-no-falco" class="btn btn-default">No validation</button>
</form>

因此，现在点击按钮-无法尔科按钮将导致整个验证被跳过，甚至有日志消息出现。然而，没有提交实际的表格。

如果我单击常规提交按钮(单击另一个按钮后)，表单就会提交。

到底怎么回事？

Answer 1

将按钮id从submit更改为其他内容

<button type="submit" class="btn btn-default">Save!</button>
<button type="button" id="button-no-falco" class="btn btn-default">No validation</button>

演示：小提琴，与id提交

它重写表单方法submit，导致.submit()调用失败。

Answer 2

试着添加：

var form=$('form');

Answer 3

试试看

$('.btn-default').click(function() {
  if($(this).attr('id') == 'button-no-falco') {
    $('#form').submit();
  } else {
   // add code for validation and if validation returns true then submit form
  }

});

把这个去掉，

$('#form').submit(function(e) {
        //If form has no-falco, don't validate.
        if ($(this).hasClass('no-falco')) {
            console.log("Skipping validation. Just submit.");
            return;
        }

        //Validation code

        e.preventDefault();


    });