HTML-form表单-input按钮type-textarea文本域-maxlength文本框最大输入字符数量-下拉选择select
45、<!--超链接和表单都可以向服务器发送请求,表单发送请求的同时可以携带数据-->
<form action="http://www.baidu.com">
<input type="text">
<input type="submit" name="百度" value="百度">
</form>
46、form标签的属性:action="" ; 用来指定服务器地址发送请求:request
47、表单项写了name属性的,一定会提交给服务器; 没有name 表单不会提交数据给服务器
48、 HTTP协议规定,必须以这种格式提交给服务器
49、input的按钮 type 属性:
---->提交按钮: type="submit" 提交按钮,具有提交表单的能力
---->普通按钮: type="button"
---->文本框 : type="text" 文本框不需要value 用户些什么就是什么
---->密码框 : type="password" 密码框不需要value 用户些什么就是什么
---->复选框 : type="checkbox"
---->单选按钮: type="radio"
---->重置清空 :type="reset"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表单form</title>
</head>
<body>
<a href="http://www.baidu.com">百度</a>
<!--超链接和表单都可以向服务器发送请求,表单发送请求的同时可以携带数据-->
<form action="http://www.baidu.com">
<input type="text">
<input type="submit" name="百度" value="百度">
</form>
<br><br><br><br><br>
<form action="http://localhost:8080/jb/login">
<table >
<tr>
<td>用户名</td> <td><input type="text" name="username" /> </td>
</tr>
<tr>
<td>密码</td> <td><input type="password" name="userpassword" /> </td>
</tr>
<tr align="center">
<!--合并单元格-->
<td colspan="2">
<!--submit reset 放到表单内部-->
<input type="submit" value="登录" />
<input type="reset" value="清空" />
</td>
</tr>
</table>
</form>
</body>
</html>
maxlength 设置文本框中可输入的字符数量<input type="text" maxlength="3"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>016-input空间的maxlength属性</title>
</head>
<body>
<!--maxlength 设置文本框中可输入的字符数量-->
<input type="text" maxlength="3"/>
</body>
</html>
50、textarea 文本域 没有value属性;用户填写内容就是value
<textarea name="" id="" cols="30" rows="10"></textarea>
51、form表单method属性:method
method="post" 属性会让用户的敏感信息隐藏在浏览器地址栏:例如:密码
method="get" 表单的属性会让用户的敏感信息显示在浏览器的地址栏
超链接:是get请求,不是post请求;超链接里面也可以提交数据,但是只能提交一次;; 需要指定不指定会默认get
form提交数据,用户填写的信息就是提交的数据,可选择
52、下拉选择 :<select name="garden" ></select>
用户注册: 用户名 姓名 密码 确认密码 性别 兴趣爱好 学历 简介(textarea)
form表单method属性:
method="post" 属性会让用户的敏感信息隐藏在浏览器地址栏;
密码 method="get"表单的属性会让用户的敏感信息显示在浏览器的地址栏 method 需要指定不指定会默认get
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>用户表单注册</title>
</head>
<body>
<form action="http://localhost:8080/jd/register" method="post">
用户名
<input type="text" name="username" id="" value="" />
<br>
密码
<input type="password" name="userpassword" />
<br>
确认密码
<input type="password" />
<br>
性别
<!--单选按钮的value必须手动指定-->
<!--想要某一个选项默认选中需要在对应的选项之后加一个checked-->
<input type="radio" name="gender" value="1" checked/>男
<input type="radio" name="gender" value="0"/>女
<br>
兴趣爱好
<input type="checkbox" name="interest"value="somke" />抽烟
<input type="checkbox" name="interest"value="dink" checked/>喝酒
<input type="checkbox" name="interest"value="fireHair" />烫头
<br>
学历
<!--selected 表示默认 是一个下拉列表-->
<select name="graden">
<option value ="gz">高中</option>
<option value ="dz">大专</option>
<option value ="bk" selected>本科</option>
<option value ="ss">硕士</option>
</select>
<br>
简介
<!--textarea 文本域 没有value属性;用户填写内容就是value-->
<textarea rows="19" cols="90" name="简介"></textarea>
<br>
<input type="submit" value="注册" />
<input type="reset" value="清空" />
</form>
</body>
</html>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix