jQuery - 防止默认,然后继续默认

IT技术 javascript jquery
2021-02-20 18:52:00

我有一个表单,当提交时,我需要在提交表单之前做一些额外的处理。我可以阻止默认的表单提交行为,然后进行我的额外处理(它基本上是调用 Google Maps API 并向表单添加一些隐藏字段)——然后我需要提交表单。

有没有办法“防止默认”,然后在某个时间点“继续默认”?

6个回答

利用 jQuery.one()

将处理程序附加到元素的事件。每个事件类型的每个元素最多执行一次处理程序

$('form').one('submit', function(e) {
    e.preventDefault();
    // do your things ...

    // and when you done:
    $(this).submit();
});

使用oneprevent 也是无限循环,因为这个自定义submit事件在第一次提交后被分离。

再次点击后会提交:(
2021-04-30 18:52:00
无限循环,函数应该是 .on 而不是 .one
2021-05-01 18:52:00
可能你会面临无限循环
2021-05-07 18:52:00
为防止死循环,首先解绑表单事件并提交。 $(this).unbind(); $(this).submit();
2021-05-20 18:52:00

当您将.submit()事件绑定到表单,并且在返回之前执行您想做的事情 (true) 时,这些事情会在实际提交之前发生。

例如:

$('form').submit(function(){
    alert('I do something before the actual submission');
    return true;
});

简单的例子

jquery.com 上的另一个示例:http ://api.jquery.com/submit/#entry-examples

这不是一个很好的例子,因为它是同步的。如果我需要做的是异步调用怎么办?所以情况是“点击提交 - > 做异步的东西,不要'提交表单 - > 在异步回调中填写表单中的一些字段 - > 从回调提交表单”
2021-04-21 18:52:00
你是说表单不会提交,直到“返回真”之前的所有代码;语句被执行?
2021-05-01 18:52:00
是的,这正是submit()函数所做的。
2021-05-02 18:52:00
运行一些异步 jQuery 代码怎么样?!也会工作吗?
2021-05-07 18:52:00
这对我很有用。我在提交之前用它来控制事情,如果事情不对,我使用“返回假”。我找了一天这个解决方案。多谢。
2021-05-09 18:52:00

我只会做:

 $('#submiteButtonID').click(function(e){
     e.preventDefault();
     //do your stuff.
     $('#formId').submit();
 });

如果您只需要提交表单preventDefault,请先调用 ,然后使用submit()函数

在任何情况下,您提供的代码段仅在用户单击按钮时才有效。这不是表格的工作方式。还有其他建议吗?
2021-05-08 18:52:00
不涉及点击事件处理程序中的逻辑。将其委托给他人负责。
2021-05-13 18:52:00
这假设肯定会点击一个按钮。如果用户只是从表单中点击“输入”按钮会怎样?这也将提交表单。因此,依赖点击提交按钮可能不是一个好主意。
2021-05-13 18:52:00
我只是举了一个点击的例子......因为问题中没有提到相关的代码......
2021-05-13 18:52:00
绑定点击,防止其默认并触发提交按钮点击
2021-05-13 18:52:00

使用这种方式你将在你的 JS 上做一个无限循环。要做得更好,您可以使用以下方法

var on_submit_function = function(evt){
    evt.preventDefault(); //The form wouln't be submitted Yet.
    (...yourcode...)

    $(this).off('submit', on_submit_function); //It will remove this handle and will submit the form again if it's all ok.
    $(this).submit();
}

$('form').on('submit', on_submit_function); //Registering on submit.

我希望它有帮助!谢谢!

@bjornmelgaard 我必须记住 async 是非标准的
2021-04-27 18:52:00
实际上最好的方法,异步函数的变化 - gist.github.com/BjornMelgaard/8ba0ee9d07c20dd8c8b3550c9df3e9ef
2021-05-12 18:52:00
      $('#myform').on('submit',function(event){
        // block form submit event
        event.preventDefault();

        // Do some stuff here
        ...

        // Continue the form submit
        event.currentTarget.submit();
  });
就我而言,我不得不使用 event.target.submit()
2021-04-23 18:52:00
他们(targetcurrentTarget)都没有工作。
2021-05-01 18:52:00
它应该是api.jquery.com/event.currentTarget除非您的目标不是表单元素,因为只有表单可以submit
2021-05-04 18:52:00
类型错误:event.currentTarget.submit 不是函数
2021-05-21 18:52:00