个人中心
gpt4 book ai didi

javascript - 是否可以在任何现有的 onsubmit/submit 之前绑定(bind) submit() 函数？

转载 作者：数据小太阳 更新时间：2023-10-29 04:27:23 26 4
gpt4 key购买 nike

我有一个带有 onsubmit 属性的表单。我需要绑定(bind)一个新的提交事件，并且我需要在任何现有提交函数之前执行此事件。

下面的代码演示了这个问题。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Test</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
      jQuery(function($) {
        // a plugin
        $('form').submit(function() {
          alert("Second");
        });
        // an other plugin
        $('form').submit(function() {
          alert("Third");
        });

        // this event must always be executed as first event
        $('form').submit(function() {
          alert("Always First");
        });
      });
    </script>
  </head>
  <body>
    <form onsubmit="javascript:alert('Fourth');">
      <p>
        <input type="submit">
      </p>
    </form>
  </body>
</html>

如果执行脚本，首先会得到“Second”，然后是“First”。

是否可以绑定(bind)一个新的提交事件并指定是否必须在任何现有事件之前调用该函数？

约束:

  • 必须保留现有事件。
  • 我无法删除现有事件，因为 onsubmit 属性的内容包含 Rails 编写的相当复杂的逻辑
  • (已添加):该事件应始终在任何现有的 onsubmit 事件和已经绑定(bind)的事件(可能由其他插件绑定(bind))之前执行

有什么想法吗？

最佳答案

内联提交事件首先触发，您可以获得对它的引用，使 form 元素上的 onsubmit 属性无效，然后绑定(bind)您的新提交事件，这一个将执行您的旧提交处理程序:

  jQuery(function($) {
    var form = $('form'), oldSubmit = form[0].onsubmit;
    form[0].onsubmit = null;

    $('form').submit(function() {
      alert("First");
      oldSubmit.call(this); // preserve the context
    });
  });

请注意，我使用 call 方法来调用您的旧提交处理程序，这是为了在该函数中保留 this 关键字，它将是 form 元素本身。

如果您原来的 onsubmit 处理程序有一些验证行为，您可以通过 var ret = oldSubmit.call(this); 获取它的返回值

检查上面的例子here .

关于javascript - 是否可以在任何现有的 onsubmit/submit 之前绑定(bind) submit() 函数？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2052123/

26 4 0
文章推荐： JavaScript:参数列表后缺少 )
文章推荐： c# - Volatile 违反了它的主要工作？
文章推荐： c# - 如何在 C# 中使用 Composite Formatting 使我自己的方法类似于 String.Format
文章推荐： javascript - IE 仅 javascript 错误与 getElementsByTagName
数据小太阳
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com