Javascript 禁用 HTML 页面上所有表单的提交功能
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10283755/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable submit functionality for all forms on a HTML page
提问by Uwe Keim
Using the .NET Windows Forms WebBrowsercontrolto show the preview of a page, I'm using the following approach described in this SO postingto disable all links on the page:
使用.NET Windows 窗体WebBrowser控件来显示页面的预览，我正在使用此 SO 发布中描述的以下方法来禁用页面上的所有链接：
$(function() {
$('a').click(function() {
$(this).attr('href', 'javascript:void(0);');
});
});
Since the HTML page I want to show as the preview also contains HTML forms, I'm looking for a similar approach to disable all form submit functionality.
由于我想作为预览显示的 HTML 页面也包含 HTML 表单，因此我正在寻找一种类似的方法来禁用所有表单提交功能。
I've tried:
我试过了：
$(function() {
$('form').attr('onsubmit', 'return false');
});
But it seems that this doesn't work (read: "still loads the page") for a form like:
但对于以下表单，这似乎不起作用（阅读：“仍在加载页面”）：
<form id="myform" name="myform" onsubmit="return search()" action="">
which I have on the page.
我在页面上。
So my question is:
所以我的问题是：
What is the best way to disable all form submit functionality on a HTML page, no matter whether it is a GET or a POST form?
在 HTML 页面上禁用所有表单提交功能的最佳方法是什么，无论是 GET 表单还是 POST 表单？
回答by Prestaul
You should be able to do:
你应该能够做到：
$('form').submit(false);
From the jQuery documentation:
In jQuery 1.4.3 you can now pass in false in place of an event handler. This will bind an event handler equivalent to: function(){ return false; }. This function can be removed at a later time by calling: .unbind( eventName, false ).
在 jQuery 1.4.3 中，您现在可以传入 false 来代替事件处理程序。这将绑定一个等价于的事件处理程序： function(){ return false; }. 稍后可以通过调用： .unbind( eventName, false ) 删除此函数。
回答by mghhgm
Use this:
用这个：
<form id="myform" name="myform" onSubmit="search();return false;" action="">
回答by Jakub Arnold
You can either disable the submit buttons
您可以禁用提交按钮
$('form :submit').attr("disabled", "disabled");
or just make the submit event do nothing
或者只是让提交事件什么都不做
$('form').submit(function(e){ e.preventDefault(); });
It depends what exactly are you trying to achieve.
这取决于你到底想达到什么目的。
回答by Jarry
using jquery i would do this
使用 jquery 我会这样做
$('form').submit(function(event){event.preventDefault();});
with jquery you normally dont use .attr(...)to bind event listeners instead you should use the helper methods, or .bind(...)
使用 jquery，您通常不用于.attr(...)绑定事件侦听器，而是应该使用辅助方法，或者.bind(...)
here its the complete reference: jQuery events
这里是完整的参考：jQuery events
回答by Robin Maben
Then you could use a combination of..
然后你可以使用..的组合
$('form :submit').attr("disabled", "disabled");
and
和
$('form').unbind('submit');
回答by Sampo Sarrala - codidact.org
If you want to prevent just form submits:
如果你想阻止只是表单提交：
I think that best approach to just prevent <form>from sending anything to anywhere is to:
我认为防止<form>将任何东西发送到任何地方的最佳方法是：
$('form').submit( function(e){
e.preventDefault();
});
This disables all forms on page, no need to do individually for every form.
这将禁用页面上的所有表单，无需为每个表单单独执行。
JSFiddle demonstration enable/disable form submit:
JSFiddle 演示启用/禁用表单提交：
回答by pomeh
Use event delegation to prevent allform within the body to be submitted.
使用事件委托来防止提交正文中的所有表单。
$("body").on("submit", "form", function( event ){
event.preventDefault();
});
By the way, your Javascript code to disable all links on the page is not a good way to do. You could use instead something like
顺便说一句，您禁用页面上所有链接的 Javascript 代码不是一个好方法。你可以使用类似的东西
// use "bind" instead of "on" if you use a jQuery version prior to 1.7
$("a").on( "click", function( ev ) {
ev.preventDefault();
});
// or use event delegation
$("body").on( "click", "a", function( ev ) {
ev.preventDefault();
});
// the power of event delegation in action:
// disable BOTH links and form with one event handler
$("body").on( "click", "a, form", function( ev ) {
ev.preventDefault();
});
Here is a working demo http://jsfiddle.net/pomeh/TUGAa/
这是一个工作演示http://jsfiddle.net/pomeh/TUGAa/
