Html <input type='button' /> 和 <input type='submit' /> 的区别
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/290215/
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
Difference between <input type='button' /> and <input type='submit' />
提问by bounav
There is no such thing as a stupid question, so here we go: What is the difference between <input type='button' />
and <input type='submit' />
?
没有愚蠢的问题,所以我们开始:<input type='button' />
和之间有什么区别<input type='submit' />
?
回答by
<input type="button" />
buttons will not submit a form - they don't do anything by default. They're generally used in conjunction with JavaScript as part of an AJAX application.
<input type="button" />
按钮不会提交表单 - 默认情况下它们不执行任何操作。它们通常与 JavaScript 结合使用,作为 AJAX 应用程序的一部分。
<input type="submit">
buttons will submit the form they are in when the user clicks on them, unless you specify otherwise with JavaScript.
<input type="submit">
除非您使用 JavaScript 另行指定,否则按钮将在用户单击时提交它们所在的表单。
回答by Aistina
A 'button' is just that, a button, to which you can add additional functionality using Javascript. A 'submit' input type has the default functionality of submitting the form it's placed in (though, of course, you can still add additional functionality using Javascript).
“按钮”就是一个按钮,您可以使用 Javascript 向其添加其他功能。“提交”输入类型具有提交其所在表单的默认功能(当然,您仍然可以使用 Javascript 添加其他功能)。
回答by Sujeet Srivastava
Button won't submit form on its own.It is a simple button which is used to perform some operation by using javascript whereas Submit is a kind of button which by default submit the form whenever user clicks on submit button.
按钮不会自己提交表单。它是一个简单的按钮,用于通过使用 javascript 执行一些操作,而提交是一种默认情况下每当用户单击提交按钮时提交表单的按钮。
回答by Martin Murphy
IE 8 actually uses the first button it encounters submit or button. Instead of easily indicating which is desired by making it a input type=submit the order on the page is actually significant.
IE 8 实际上使用它遇到的第一个按钮提交或按钮。通过将其设置为输入类型=提交,而不是轻松地指示需要哪个页面上的订单实际上很重要。
回答by Eugen Mihailescu
It should be also mentioned that a named input of type="submit" will be also submitted together with the other form's named fields while a named input type="button" won't.
还应该提到的是,type="submit" 的命名输入也将与其他表单的命名字段一起提交,而命名输入 type="button" 则不会。
With other words, in the example below, the named input name=button1
WON'Tget submitted while the named input name=submit1
WILLget submitted.
换句话说,在下面的示例中,命名输入name=button1
不会被提交,而命名输入name=submit1
将被提交。
Sample HTML form (index.html):
示例 HTML 表单 (index.html):
<form action="checkout.php" method="POST">
<!-- this won't get submitted despite being named -->
<input type="button" name="button1" value="a button">
<!-- this one does; so the input's TYPE is important! -->
<input type="submit" name="submit1" value="a submit button">
</form>
The PHP script (checkout.php) that process the above form's action:
处理上述表单操作的 PHP 脚本 (checkout.php):
<?php var_dump($_POST); ?>
Test the above on your local machine by creating the two files in a folder named /tmp/test/ then running the built-in PHP web server from shell:
通过在名为 /tmp/test/ 的文件夹中创建两个文件,然后从 shell 运行内置的 PHP Web 服务器,在本地计算机上测试上述内容:
php -S localhost:3000 -t /tmp/test/
Open your browser at http://localhost:3000and see for yourself.
在http://localhost:3000 上打开浏览器并亲自查看。
One would wonder why would we need to submit a named button? It depends on the back-end script. For instance the WooCommerce WordPress plugin won't process a Checkout page posted unless the Place Order
named button is submitted too. If you alter its type from submitto buttonthen this button won't get submitted and thus the Checkout form would never get processed.
有人会想为什么我们需要提交一个命名按钮?这取决于后端脚本。例如,WooCommerce WordPress 插件不会处理发布的结帐页面,除非Place Order
也提交了命名按钮。如果您将其类型从提交更改为按钮,则不会提交此按钮,因此永远不会处理结帐表单。
This is probably a small detail but you know, the devil is in the details.
这可能是一个小细节,但你知道,细节决定成败。
回答by Shashank Malviya
type='Submit'
is set to forward & get the values on BACK-END (PHP, .NET etc).
type='button'
will reflect normal button behavior.
type='Submit'
设置为转发并获取 BACK-END 上的值(PHP、.NET 等)。
type='button'
将反映正常的按钮行为。
回答by Shashank Malviya
<input type="button">
can be used anywhere, not just within form and they do not submit form if they are in one. Much better suited with Javascript
.
<input type="button">
可以在任何地方使用,而不仅仅是在表单中使用,如果它们在一个表单中,它们就不会提交表单。更适合与Javascript
.
<input type="submit">
should be used in forms only and they will send a request (either GET or POST) to specified URL. They should notbe put in any HTML place.
<input type="submit">
应仅在表单中使用,它们将向指定的 URL 发送请求(GET 或 POST)。他们应该不是放在任何HTML地方。