如何使用 HTML5 指定按钮的类型？

在 HTML5 中，通过指定按钮的类型属性来定义按钮的行为。根据按钮的类型，浏览器将采取不同的默认行为。

以下是HTML5中可用的不同类型的按钮：

• submit按钮：用于向表单提交数据
• reset按钮：用于重置表单数据
• button按钮：用于执行JavaScript代码，不会自动将表单数据提交给服务器
• checkbox按钮：用于选择一个或多个选项
• radio按钮：用于从一组选项中选择一个选项

设置按钮类型

HTML代码如下所示：

<form>
  <input type="submit" value="Submit">
  <input type="reset" value="Reset">
  <input type="button" value="Click me">
  <input type="checkbox" name="vehicle1" value="Car">I have a car<br>
  <input type="checkbox" name="vehicle2" value="Bike">I have a bike<br>
  <input type="radio" name="gender" value="male">Male<br>
  <input type="radio" name="gender" value="female">Female<br>
</form>

在上面的代码中，我们创建了五个不同类型的按钮：submit，reset，button，checkbox，radio。

submit按钮

submit按钮用于向表单提交数据。在单击提交按钮时，表单数据将被发送到服务器。

HTML代码：

<input type="submit" value="Submit">

reset按钮

reset按钮用于重置表单数据。在单击重置按钮时，表单中的所有字段都将重置为其默认值。

HTML代码：

<input type="reset" value="Reset">

button按钮

button按钮用于执行JavaScript代码，不会自动将表单数据提交给服务器。

HTML代码：

<input type="button" value="Click me" onclick="alert('Hello World!')">

checkbox按钮

checkbox按钮用于选择一个或多个选项。

HTML代码：

<input type="checkbox" name="vehicle1" value="Car">I have a car<br>
<input type="checkbox" name="vehicle2" value="Bike">I have a bike<br>

radio按钮

radio按钮用于从一组选项中选择一个选项。

HTML代码：

<input type="radio" name="gender" value="male">Male<br>
<input type="radio" name="gender" value="female">Female<br>

这就是如何在HTML中使用不同类型的按钮。根据您的需求，选择适当的按钮类型，并使其与您的表单交互。