按钮类型"button"与“提交" [英] Button type "button" vs. "submit"

问题描述

带有type="button"的button与type="submit"之间是否存在区别?有功能上的区别吗?还是只是描述性名称，以便于阅读代码?

Is there a difference between a button with type="button" vs type="submit"? Are there functional differences, or is it just a descriptive name for easier code reading?

这与input不同吗?

推荐答案

来自

type
按钮的类型.可能的值是:

type
The type of the button. Possible values are:

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

• submit: The button submits the form data to the server. This is the default if the attribute is not specified, or if the attribute is dynamically changed to an empty or invalid value.
• reset: The button resets all the controls to their initial values.
• button: The button has no default behavior. It can have client-side scripts associated with the element's events, which are triggered when the events occur.

关于button和input之间的区别:

• button可以具有单独的值作为数据，而对于input，数据和按钮文本始终相同:

• A button can have a separate value as data, while for an input the data and button text are always the same:

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

button可以具有HTML内容(例如图像)，而input只能具有文本.

A button can have HTML content (e.g. images), while an input can only have text.

与CSS中的其他input控件(例如文本字段)相比，button可能更容易分辨.注意向后浏览器的兼容性.

A button may be easier to tell apart from other input controls (like text fields) in CSS. Note backwards browser compatibility.

input {

}
button { /* Always works */

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

}

这篇关于按钮类型"button"与“提交"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！