Question

没有愚蠢的问题，所以我们开始：<input type='button' />和<input type='submit' />之间的区别是什么？

Answer 1

<input type="button" />按钮不会提交表单 - 默认情况下它们不会执行任何操作。它们通常与JavaScript一起用作AJAX应用程序的一部分。

除非您使用JavaScript另行指定，否则

<input type="submit">按钮将提交用户点击它们时所使用的表单。

Answer 2

“按钮”就是一个按钮，您可以使用Javascript向其添加其他功能。 “提交”输入类型具有提交其放置的表单的默认功能（当然，您仍然可以使用Javascript添加其他功能）。

Answer 3

Button不会自行提交表单。它是一个简单的按钮，用于通过使用javascript执行某些操作，而Submit是一种按钮，默认情况下，只要用户点击提交按钮就会提交表单。

Answer 4

IE 8实际上使用它遇到的第一个按钮提交或按钮。而不是通过使其成为输入类型来轻松指出哪个是期望的=提交页面上的订单实际上是重要的。

Answer 5

还应该提到类型=＆＃34;提交＆＃34;的命名输入。也将与其他表单的命名字段一起提交，而命名输入类型=＆＃34;按钮＆＃34;韩元＆＃39;吨

换句话说，在下面的示例中，指定的输入name=button1 WON＆＃39; T 会在指定的输入name=submit1 时提交>得到提交。

示例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>

处理上述表单操作的PHP脚本（checkout.php）：

<?php var_dump($_POST); ?>

在本地计算机上测试以上内容，方法是在名为/ tmp / test /的文件夹中创建两个文件，然后从shell运行内置的PHP Web服务器：

php -S localhost:3000 -t /tmp/test/

在http://localhost:3000打开浏览器，亲身体验。

有人会想知道为什么我们需要提交一个命名按钮？这取决于后端脚本。例如，除非提交Place Order命名按钮，否则WooCommerce WordPress插件不会处理已发布的Checkout页面。如果您将其类型从提交更改为按钮，则此按钮将无法提交，因此Checkout表单将永远不会得到处理。

这可能是一个小细节，但你知道，魔鬼在细节中。

Answer 6

<input type="button">可以在任何地方使用，而不仅仅是在表单中，如果它们在一个表单中，它们就不会提交表单。更适合Javascript。

<input type="submit">只能在表单中使用，并且会向指定的URL发送请求（GET或POST）。他们应该不放在任何HTML位置。

Answer 7

W3C在关于Button元素

的规范中明确说明

Button可能被视为所有类型按钮的泛型类，没有默认行为。

W3C

Answer 8

type='Submit'设置为转发＆amp;获取BACK-END（PHP，.NET等）上的值。 type='button'将反映正常的按钮行为。

<input type =“button”/>和<input type =“submit”/>之间的区别

8 个答案: