HTML input submit 按钮

小灰灰 2020-05-16 20:53 752阅读 0赞

# HTML input submit 按钮

将`<input>`标签的type属性值设置为"submit"即可创建一个提交按钮。

点击提交按钮，表单会有提交动作，下面结合代码实例进行一下介绍。

首先看一段简单代码：

```html
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dandelioncloud.cn/" />
<title>蒲公英云</title> 
</head>
<body>
<form name="myform" method="post" action="do.php">
  账号：<input type="text"/><br/>
  密码：<input type="text"/><br/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
    </form>
</body>
</html>
```

点击提交按钮，会将表单元素的值提交到do.php。

提交按钮具有的主要属性如下：

（1）.autofocus（HTML5）：规定在页面加载时，按钮自动地获得焦点。

（2）.disabled：设置按钮为不可用。

（3）.value：设置按钮的显示文本内容，在表单中，数据也会被提交。

```html
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.dandelioncloud.cn/" />
<title>蒲公英云</title> 
</head>
<body>
<form name="myform" method="post" action="do.php">
  账号：<input type="text"/><br/>
  密码：<input type="text"/><br/>
        <input type="submit" value="提交" autofocus/>
        <input type="reset" value="重置"/>
    </form>
</body>
</html>
```

为按钮设置autofocus属性，代码运行效果截图如下：

![](/images/1589662370781.jpg)

页面加载后，将会自动获取焦点，非常容易理解。

给按钮设置disabled属性后，此按钮将处于不可用状态，它的value值也不会被提交。

发表评论取消回复

表情：

评论列表（有 0 条评论，752人围观）

还没有评论，来说两句吧...

相关阅读

相关 html 提交按钮(input submit)

submit默认是提交表单,跳转页面或刷新(跳转到本页),可以用`prevent`来阻止 <form> <input name="key">

我会带着你远行/ 2022年10月27日 01:42/ 0 赞/ 169 阅读

相关 HTML

HTML <button> 和 input type=“button”的区别： 1. <button>标签里可以放文本图片等内容，与<input>创建的按钮不同。 2

亦凉/ 2022年06月18日 09:26/ 0 赞/ 193 阅读

相关 input type="submit"和“button”区别

转载自:[https://www.zhihu.com/question/20839977/answer/16354924][https_www.zhihu.com_questi

青旅半醒/ 2022年05月24日 04:19/ 0 赞/ 154 阅读

相关 HTML5 表单验证，绑定到非 submit 按钮上

在做一个多步表单时，需要在每一步验证表单项，然而 HTML5 表单验证只是在 submit 按钮点击时才触发。为了在每一步单独验证该步中的表单项，需要将验证触发绑定到非 sub

怼烎@/ 2022年04月24日 06:22/ 0 赞/ 68 阅读

相关 button按钮和submit按钮有什么区别？

button按钮和submit按钮有什么区别？ button-普通按钮，submit-提交按钮。 submit是button的一个特例，也是button的一种，它把提交这...

小灰灰/ 2020年06月10日 14:47/ 0 赞/ 792 阅读

相关 HTML input submit 按钮

将`<input>`标签的type属性值设置为"submit"即可创建一个提交按钮。点击提交按钮，表单会有提交动作，下面结合代码实例进行一下介绍。

小灰灰/ 2020年05月16日 20:53/ 0 赞/ 753 阅读

相关 HTML input button 按钮

HTML input button 按钮将`<input>`标签的type属性值设置为"button"即可创建一个按钮。点击按钮可以触发一个事件，通常需要结合Java...

小灰灰/ 2020年05月16日 18:07/ 0 赞/ 935 阅读

相关 HTML input image 按钮

HTML input image 按钮 `<input>`标签 type 属性值设置为 "image" 即可创建一个图片按钮。图片按钮与submit提交按钮一样，点击可...

小灰灰/ 2020年05月16日 18:04/ 0 赞/ 668 阅读

相关 HTML input radio 单选按钮

`< input>` 标签 type 属性值设置为 "radio"，即可创建一个单选按钮。既然是单选按钮，按钮之间通常互斥，同一时刻只能有一项处于选中状态。 ...

小灰灰/ 2020年05月15日 17:24/ 0 赞/ 994 阅读

相关 HTML input reset 重置按钮

将input标签type属性值设置为"reset"即可生成一个重置按钮。此按钮一般和提交按钮配合使用，当然不是硬性标准。首先看一段代码实例：

小灰灰/ 2020年05月15日 17:20/ 0 赞/ 803 阅读