javascript - 提交时截取表单

Question

有什么方法可以拦截 html 表单的 onsubmit 事件吗？ 在我的网络应用程序中，有几个包含表单等的屏幕。我们面临的问题是当用户多次按下任何按钮时，服务器会因为相同的请求而重载。 一些表单已经附加了事件处理程序(如 onSubmit、button.onClick 等)。 一种方法是通过遍历所有屏幕来“注入(inject)”我的按钮禁用代码。

但我正在寻找的是一种通用解决方案，只需包含编写函数的脚本即可应用于所有屏幕。

我知道我可以使用 jQuery 设置回调(为表单捕获 onSubmit)，但在这种情况下的问题是，如果任何屏幕已经注册了 onSubmit，它可能不会被调用。

在这方面的任何帮助表示感谢!

Answer 1

我认为这段代码是一个很好的起点。它应该放在单独的文件中并包含在您想要使用它的地方(如果您似乎有全局脚本列表 - 这是一个很好的地方)

var suppressed_items = [];

function allowOnlyOne(item,e){
    if (jQuery.inArray(item, suppressed_items)==-1){
        //hi little item, I haven't saw you before, please go on... but I remember you
        suppressed_items.push(item);
        return true;
    }
    else{
        //Hey, you have been submitted already, stay where you are!
        return false; //or e.preventDefault(), it's a matter of faith :)
    }
}

jQuery(document).ready(function(){ 
    //don't worry, it won't replace your `ready` handlers, but just append new handler
    jQuery("from").submit(function(e){
        return allowOnlyOne(jQuery(this),e);
    });
});

您可以对任何项目使用 allowOnlyOne 函数。因此，例如，要允许单击所有超链接，请在 ready 处理程序中添加:

jQuery("a").click(e){
    return allowOnlyOne(jQuery(this),e);
}

我希望您了解基本思路:捕获事件，获取触发它的元素的 ID，将其与事件一起提供给 AllowOnlyOne。

当然你可以把它全部包裹成自执行的闭包来实现封装等等...