33

buttona with type="button"vs之间有区别type="submit"吗？是否存在功能差异，或者它只是一个便于代码阅读的描述性名称？

这有什么不同input吗？

4

6 回答 6

34

来自MDN：

type
按钮的类型。可能的值为：

  • submit：按钮将表单数据提交到服务器。如果未指定属性，或者属性动态更改为空值或无效值，则这是默认值。
  • reset：该按钮将所有控件重置为其初始值。
  • button：该按钮没有默认行为。它可以具有与元素事件相关联的客户端脚本，这些事件在事件发生时被触发。

button至于和之间的区别input：

  • Abutton可以有一个单独的值作为数据，而对于一个input数据和按钮文本总是相同的：

    <input type="button" value="Button Text"> <!-- Form data will be "Button Text" -->
<button type="button" value="Data">Button Text</button>

  • Abutton可以有 HTML 内容（例如图像），而 aninput只能有文本。

  • A可能更容易与CSS 中的其他控件（如文本字段）区button分开来。input注意向后浏览器兼容性。

    input {

}
button { /* Always works */

}
input[type=button] { /* Not supported in IE < 7 */

}
于 2016-06-09T21:05:09.103 回答
11

具有“按钮”类型的按钮不会提交表单，但没有类型或 type=submit（默认）的按钮将提交。type=submit 的按钮与 type=submit 的输入几乎相同，但按钮可以包含 HTML 内容。

于 2016-06-09T21:03:36.887 回答
3 
<input type="button" />

按钮不会提交表单 - 默认情况下它们不做任何事情。它们通常与 JavaScript 结合使用，作为 AJAX 应用程序的一部分。

<input type="submit">

按钮将在用户单击它们时提交它们所在的表单，除非您使用 JavaScript 另有指定。

当通过以下代码提交表单时，我们应该使用 type=button 而不是 type=submit 来防止表单提交两次。

@using (Html.BeginForm("View", "Controller", FormMethod.Post, new { id = "signupform" }))
        {
         //Form elements
        }
于 2019-11-26T13:09:47.010 回答
1

按钮的风格化比用于锚标签（链接）的输入要好得多。

  • 图片
  • 内容等

输入可以实现与按钮相同的功能，但设计更丑陋。

假设输入是老式的，按钮更酷。

于 2019-01-24T07:39:33.557 回答
1

它们在向服务器提交表单数据方面有不同的默认行为。按钮有一个名为“type”的属性，可以包含这些值：

submit：具有将表单数据提交到服务器的默认行为。如果未指定属性，或者属性动态更改为空值或无效值，则这是默认值。

button：该按钮没有默认行为。它可以具有与元素事件相关联的客户端脚本，这些事件在事件发生时被触发。

于 2019-01-30T06:51:01.980 回答
0

<button type="button"></button>按钮不会提交表单 - 默认情况下它们不做任何事情。按钮不会自行提交表单。它是一个简单的按钮，用于使用 javascript 执行某些操作，而提交是一种按钮，默认情况下，只要用户单击提交按钮，就会提交表单。

于 2018-01-02T10:03:46.360 回答