HTML 教程

HTML 属性

HTML 标签列表

HTML API

HTML 案例

HTML 颜色

HTML5 进阶

HTML 其它

HTML 面试问题

HTML <button>按钮标签

<button> 标签用于在网页的 HTML 表单中创建一个可点击的按钮。您可以将文本或图像等内容放在 <button>........</button> 标签中。

您应该始终为 <button> 标记指定 type 属性。不同的浏览器对按钮元素使用不同的默认类型。

HTML Button 标签可以在表单内部和外部使用。

如果您在 form 中使用它，它将用作提交按钮。您也可以将其用作重置按钮。

如果在 form 之外使用它，你可以在它上面调用 JavaScript 函数。

HTML 按钮标签示例

让我们看看显示按钮的代码。

<button name="button" type="button">Click Here</button>

输出：

HTML 按钮示例：调用 JavaScript 函数

让我们看看在按钮点击时调用 JavaScript 函数的代码。

<!DOCTYPE>
<html>  
<body>  
<button name="button" value="OK" type="button" onclick="hello()">Click Here</button>  
<script>  
function hello(){  
alert("hello javatpoint user");  
}  
</script>  
</body>
</html>

输出：

HTML 按钮示例：提交表单

让我们看看在按钮点击时提交表单的代码。

<form>  
Enter Name:<input type="text" name="name"/><br/>  
<button>Submit</button>  
</form>

输出：

输入名字：

HTML 按钮示例：重置表单

让我们看看在按钮点击时提交表单的代码。

<form>  
Enter Name:<input type="text" name="name"/><br/>  
<button type="reset">reset</button>  
</form>

输出：

输入名字：

HTML Button 标签的属性

<button> 标签支持所有全局属性和一些特定的附加属性。

给出了一个 HTML 按钮标签属性列表。

属性描述
autofocus它指定按钮在加载页面时应自动获得焦点。
disabled它指定一个按钮应该被禁用。
form它指定按钮所属的一种或多种形式。
formaction它用于提交类型。它指定提交表单时将表单数据发送到何处。
formmethod它指定如何发送表单数据。
formenctype它指定在将表单数据发送到服务器之前应如何对其进行编码。
formnovalidate它指定不应在提交时验证表单数据。
formtarget它指定提交表单后在何处显示响应。
name它指定按钮的名称。
type它指定按钮的类型。
value它指定按钮的值。

支持浏览器

元素ChromeIEFirefoxSafariOpera
<button>YesYesYesYesYes


上一主题 HTML <br>换行标签 下一主题 HTML <canvas>画布标签
  • 使用社交账号登录,本站支持
全部评论(0)

便捷工具