input submit button 傻傻分不清楚

提交按钮

在页面中表示一个按钮有多种表示方式,比如较为常见的有

页面会出现四个长得一模一样的按钮,真叫人傻傻分不清楚呀。其实主要区别在于按钮点击后是否会触发表单数据向后台传送。先说结论

  • input[type]为submit和button,即按钮“提交1”和“提交3”会触发表单数据传送
  • input[type]为button和button[type]为button,即按钮“提交2”和“提交4”不会触发表单数据传送,仅仅只是一个能点击的按钮而已。

button

对于是等价的。type可选值:

  • submit:此按钮将表单数据提交给服务器。如果未指定属性,或者属性动态更改为空值或无效值,则此值为默认值。
  • reset:此按钮重置所有组件为初始值。
  • button:此按钮没有默认行为。它可以有与元素事件相关的客户端脚本,当事件出现时可触发。
    更多详情请查询MDN
    ).

input

input是一个空元素,没有闭合标签;而button标签内可以插入内容元素。input类型非常非常多,详细可查询MDN.
有一点需要铭记,如果想要将数据提交,别忘了一定要把按钮写在form标签内,写在外面是不起作用滴!

参考博文:https://harttle.land/2015/08/03/form-submit.html

你可能感兴趣的:(input submit button 傻傻分不清楚)