HTML 表单

2020-12-26 22:35:30 阅读：153 来源： 互联网

文本输入

<form>
 First name:<br>
<input type="text" name="firstname" value="aa"> <!--必须有name属性才能向后端传值,value提供默认值-->
<br>
 Last name:<br>
<input type="text" name="lastname">
</form>

单选按钮输入

<form>
<input type="radio" name="sex" value="male" checked>Male<!--checked默认勾选此项-->
<br>
<input type="radio" name="sex" value="female">Female
</form>

提交表单数据按钮

<form action="action_page.php">
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>

select下拉列表

<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>

多行文本输入

<textarea name="message" rows="10" cols="30">
The cat was playing in the garden.
</textarea>

button按钮

<button type="button" onclick="alert('Hello World!')">点击我！</button>
<!-- 与js函数绑定,
-->
<input type="Submit" vlue="Submit"/>
<!-- 提交表单按钮,
-->
<input type="button" onclick="alert('Hello World!')" value="Click Me!">
<!--似乎与第一个按钮没区别-->

password

<form>
 User name:<br>
<input type="text" name="username">
<br>
 User password:<br>
<input type="password" name="psw"><!--password 字段中的字符会被做掩码处理-->
</form>

复选框

<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike
<br>
<input type="checkbox" name="vehicle" value="Car">I have a car 
</form>

文件

<input type="file" name="img" multiple="multiple" />

HTML5新增输入类型

color
date
datetime
datetime-local
email
month
number
range
search
tel
time
url

HTML Input属性

value规定输入字段的初始值
readonly规定字段只读
disabled规定输入字段禁用，被禁用的元素不会被提交。
size规定输入字段的尺寸
autofacus规定设置的input元素自动获得焦点
formenctype规定当把表单数据提交至服务器时如何对其编码，如multipart/form-data,仅针对method=post。

<form action="demo_post_enctype.asp" method="post">
   First name: <input type="text" name="fname"><br>
   <input type="submit" value="Submit">
   <input type="submit" formenctype="multipart/form-data" formmethod="POST"
   value="Submit as Multipart/form-data">
</form>

formmethod定义提交数据的HTTP方法。
formtarget指示在何处显示接收到的响应。
mutiple允许用户在input元素输入一个以上的值，适用于一下输入类型：email和file。
pattern用于检查<input>元素值的正则表达式。
placeholder用以描述输入字段预期值的提示。

required规定必须填写该字段。

标签：name,表单,HTML,规定,提交,输入,First
来源： https://www.cnblogs.com/biwangwang/p/14194719.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9