html--form表单
<!-- form 标签
作用:收集并提交用户的信息
属性:
id 表单的id,用于js获取表单
name 表单的名字,用于js获取表单
action 表单提交的地址
method 表单提交的方式,常用值为get和post
get(默认)
post
enctype 表单中数据的编码方式
application/x-www-form-urlencoded(默认)
multipart/form-data
text/plain
form标签的子标签(表单域)
注意:1.对于所有的子标签来讲,只有添加name属性,才可以提交!
2.一般来讲,value属性就是提交的值
3.对于radio和checkbox而言,如果没有设定value属性,则提交时值为on
4.对于select而言,select提交的值就是option标签的value属性值,如果option标签没有设定value属性值时,默认提交option标签中间的文本值
5.对于textarea而言,textarea提交的值不是value属性,而是标签中间的文本数据
6.对于三个按钮来讲,input和button从本质来讲并无区别,而且一般情况不用设置name属性(即不用提交)
input 属性
type="text" 文本框
type="password" 密码框
type="hidden" 隐藏框
type="file" 文件框
type="radio" 单选按钮
name属性相同即为一组
type="checkbox" 复选框
name属性相同即为一组
对于input type="radio"和input type="checkbox"来讲,添加check="check"属性表示默认选中该选项
type="submit" 提交按钮,提交表单
type="reset" 重置按钮,重置表单
type="button" 普通按钮,用于被js调用
对于input type="submit"、input type="reset"和input type="button"来讲,value属性表示按钮上的文字
select 下拉列表框
给select添加multiple="multiple"的属性后,就变成多选
需要和option标签一起使用
textarea 多行文本域
button 按钮
--> <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<form action="http://www.baidu.com" method="get" enctype="application/x-www-form-urlencoded">
用户名:<input type="text" name="username" placeholder="请填写用户名"/><br/>
密码:<input type="password" name="pwd"/><br/>
<input type="hidden"e="hiddenfile"/><br/>
<input type="file" name="file"/><br/>
性别:<label for="women">女</label><input id="women" type="radio" name="gender" value="女"/>
<label for="man">男</label><input id="man" type="radio" name="gender" value="男"><br/>
篮球 <input type="checkbox" name="sports" value="篮球"/>
足球<input type="checkbox" name="sports" value="足球"/> <br/>
<select name="city">
<option value="广州">广州</option>
<option value="深圳">深圳</option>
<option value="佛山">佛山</option>
</select> <textarea name="inc" cols="" rows="">滴滴……</textarea> <input type="button"/><input type="submit"/><input type="reset"/> <button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">普通</button>
</form>
</body>
</html>
html--form表单的更多相关文章
- form表单验证-Javascript
Form表单验证: js基础考试内容,form表单验证,正则表达式,blur事件,自动获取数组,以及css布局样式,动态清除等.完整代码如下: <!DOCTYPE html PUBLIC &qu ...
- Form 表单提交参数
今天因为要额外提交参数数组性的参数给form传到后台而苦恼了半天,结果发现,只需要在form表单对应的字段html空间中定义name = 后台参数名 的属性就ok了. 后台本来是只有模型参数的,但是后 ...
- form表单 ----在路上(15)
form 表单就是将用户的信息提交到服务器,服务器会将信息存储活着根据信息查询数据进行增删改查,再将其返回给用户. 基本格式: <form action="" method ...
- form表单的字符串进行utf-8编码
<form>表单有assept-charset属性.该属性规定字符的编码方式,默认是"unknown",与文档的字符集相同. 该属性除了Internet explore ...
- 细说 Form (表单)
细说 Form (表单) Form(表单)对于每个WEB开发人员来说,应该是再熟悉不过的东西了,可它却是页面与WEB服务器交互过程中最重要的信息来源. 虽然Asp.net WebForms框架为了帮助 ...
- 通过form表单的形式下载文件。
在项目中遇到问题,要求动态拼接uri下载文件.但是由于项目的安全拦截导致window.location.href 和 window.open等新建窗口的方法都不行. 无意间百度到了通过form表单来下 ...
- form 表单跨域提交
<!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...
- form表单的属性标签
form表单的常用标签 表单: <form id="" name="" method="post/get" action=" ...
- form表单的属性标签和练习
form表单的标签 做一个如下图的form表单: 我们的代码如下: <body leftmargin="400px" topmargin="200px"& ...
- Django基础,Day5 - form表单投票详解
投票URL polls/urls.py: # ex: /polls/5/vote/ url(r'^(?P<question_id>[0-9]+)/vote/$', views.vote, ...
随机推荐
- zznuoj 1540 : 直线与圆
题目描述 给出一个圆的圆心坐标与圆的半径,和一条直线上的两点坐标,求这条直线与圆有多少个交点. 输入 输入3个实数x,y,r值分别表示圆心坐标与圆的半径,输入4个实数x1,y1,x2,y2表示直线上的 ...
- 20164322韩玉婷 -----EXP3 免杀原理与实践
基础问题回答 1.杀软是如何检测出恶意代码的? (1)基于特征码的检测 特征码是能识别一个程序是一个病毒的一段不大于64字节的特征串.如果一个可执行文件包含这样的特征码则被杀毒软件检测为是恶意代码. ...
- 9th week blog
1957年 约翰·巴科斯(John Backus)创建了是全世界第一套高阶语言:FORTRAN. 1959年 葛丽丝·霍普(Grace Hopper)创造了现代第一个编译器A-0 系统,以及商用电脑编 ...
- Java中如何拆分字符串为字符数组
题目:输入一串字符,由(){}[]组成,判断是否所有的括号都是闭括号,是的返回TRUE,不是返回FALSE. /*输入字符串,拆解为字符数组 * 用函数s.charAt(i)来完成 * * */imp ...
- pycharm+pydesigner+pyqt5 如何添加图片资源
pydesigner 上添加资源比较容易: 步骤一用于编辑,步骤二步创建,步骤三创建文件新的qrc: 步骤一:新建一个Prefix,步骤二给prefix添加资源文件.至此,资源文件添加完成 采用 Py ...
- js 实现拖拽排序
<!DOCTYPE> <html lang="zh-cn"> <head> <meta http-equiv="Content- ...
- BZOJ5311,CF321E 贞鱼
题意 Problem 5311. -- 贞鱼 5311: 贞鱼 Time Limit: 3 Sec Memory Limit: 162 MBSubmit: 677 Solved: 150[Subm ...
- 新手入门HTML5有什么推荐的书籍?
很多想迈入HTML5开发行列的人,都会问一个问题:要成为一个更好的开发人员,我应该读哪些书?有哪些HTML5开发的书籍推荐吗? 有人说开卷有益,读万卷书行万里路;有人说,书不在多,精益求精;有人说,书 ...
- Java高级特性 第13节 解析XML文档(1) - DOM和XPath技术
一.使用DOM解析XML文档 DOM的全称是Document Object Model,也即文档对象模型.在应用程序中,基于DOM的XML分析器将一个XML文档转换成一个对象模型的集合(通常称DOM树 ...
- spring 事务传播机制
spring 事务 传播机制 描述的 事务方法直接相互调用,父子事物开启,挂起,回滚 等的处理方式. 绿色的 那几个 我认为比较重要. 1 , @Transactional(propagation=P ...