22 按钮

22按钮

用途

按钮标签根据type属性值不同可实现不同的功能。

submit 提交按钮,点击后可将数据提交到后台

reset 重置按钮,点击后表单控件恢复默认值

button 普通按钮,默认没有功能,一般配合js使用

示例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 表单控件及按钮需要form标签包裹后,按钮相关功能才能生效,action用于定义发送数据的地址,可为空 -->
    <form action="">
        <!-- 定义用户名输入文本框 -->
        <label>用户名:<input type="text" placeholder="请输入用户名"></label>
        <br><br>
        <!-- 定义密码输入文本框 -->
        <label>密码:<input type="text" placeholder="请输入密码"></label>
        <br><br>
        <!-- button的type属性为submit,定义按钮为提交按钮,点击后可将数据提交到后台 -->
        <button type="submit">提交</button>
        <!-- button的type属性为reset,定义按钮为重置按钮,点击后可重置页面表单控件内容为默认值 -->
        <button type="reset">重置</button>
        <!-- button的type属性为button,普通按钮,默认没有功能,一般配合js使用 -->
        <button type="button">普通按钮</button>
    </form>
</body>

</html>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值