javascript - jQuery 提交 'this' 表单

Question

我正在尝试提交一个表单，一旦用户接受了他们想通过 jQuery UI 对话框继续。

<form method="POST" action="url" onsubmit="return APP.dom.confirm(this);">
   <button type="submit" class="btn btn-sm btn-danger"><i class="fa fa-trash"></i></button>
</form>

我的 APP.dom.confirm 方法如下所示:

 confirm: function(form) {
    $("#dialog-confirm").dialog({
       modal: true,
       buttons: {
          "Confirm": function() {
             $(form).submit();
          },
          "Cancel": function() {
             $(this).dialog("close" );
          }
       }
    });

    return false;
 }

这有效，但是当他们点击确认时，我希望提交表单。

$(form).submit();

那是行不通的。注销后我得到了上面的 HTML。我试过各种变体，但无济于事:

$(form).clostest('form').submit();

如何提交this？

Answer 1

改变

$(form).submit();

到

form.submit();

当您在 jQuery 对象上调用 submit 时，它会再次调用您的提交处理程序。直接在 DOM 元素上调用它不会。

示例 (有趣的是，Stack Snippets 不允许我提交表单，即使使用 target="_blank"也不行):

var nesting = 0;
function submitHandler(form) {
  var which = $(form).find("input[type=radio]:checked").val();
  ++nesting;
  if (nesting > 5) {
    snippet.log("Nested to 5, gave up");
  } else {
    if (which === "jQuery") {
      snippet.log("Calling via jQuery, nesting = " + nesting);
      $(form).submit();
    } else {
      snippet.log("Calling via DOM, nesting = " + nesting);
      form.submit();
    }
  }
  --nesting;
  return false;
}

<form id="the-form"
      onsubmit="return submitHandler(this);"
      action="http://www.google.com/search"
      target="_blank"
      method="GET">
  <input type="text" name="q" value="kittens">
  <div>
    <label>
      <input type="radio" name="opts" value="jQuery"> Submit with jQuery
    </label>
  </div>
  <div>
    <label>
      <input type="radio" name="opts" value="DOM"> Submit with DOM
    </label>
  </div>
  <button>Submit</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>