form表单详解
form表单
form是一个复杂的系统标签,其内部又可包含很多的一些输入标签
例如input 输入文本标签 checkbox 多选标签等等
form表单有几个属性我们需要注意一下
1:action属性,里面写的是url链接,接就是表单提交的地址
2:method属性,里面写的是数据提交的方式,可以写入get或者post
3:enctype属性,提交数据的编码格式
form表单中的标签的前后台交互
form表单被我们应用在前后台交互的环节的,里面的值可以在后台通过某些key取出来
下面就来讲解不同标签取值的方法
1. input 标签
input标签我们最为常见,里面有三个属性比较重要
a. type 他是代表input的类型
b. name 他就是后台取值的依据(key)
c. val 他是我们输入的值,也是后台需要的值
<input type="" name="">
然后我们根据type的类型,又可以把input进行细分
a. text 表示普通的文本,明文输入
b. password 输入的也是文本,密文输入
c. number 输入的是数字,不是数字不让输入
d. submit 提交按钮,提交form表单的内容
e. button 普通的按钮
f. radio 单选框,我们需要注意的是单选框的所有的name值必须相同
如果name不相同,就说明不在同一个选择方位,也就不存在单选,然后想要在后台取到他的值,
你必须在定义的时候给附上一个值给value,这样才能取到值
g. checkbox 复选框,内容和单选框一样
h. file 选择文件,可以选择文件提交给后台
以上基本是input的所有类型,需要注意几个点
1.取值都是通过name进行取值,所以必须给name赋值
2.文本类型想要附上初始值,直接在value中加入值就可以
3.选择框如果想要默认选中谁,那就在谁的标签中加入checked属性
2. select 标签
select标签是一个下拉框的形式让用户进行选择选项
所以select标签中必须包含option标签才能显示属性
形式为:
<select>
<option></option>
<option></option>
</select>
然后select中有全局属性name,这个name是后台又来进行取值的
每个option标签的文本内容是显示给用户看的,我们需要取的是option标签中的value属性,所以在开始必须给option的value赋值
后台通过select的name取值,直接取到的就是对应option的value
如果我们向让他默认选择某个option,可以在option标签中加入selected属性,如果都不加,默认是显示第一个
3. button 按钮标签
新出的标签,与input中type为button的按钮一样
4. textarea 文本框标签
与input中的text一样都是输入文本的,但是textarea标签没有字数的限制,并且输入框可以拖拉。
form表单详解的更多相关文章
- Django学习笔记之Django Form表单详解
知识预览 构建一个表单 在Django 中构建一个表单 Django Form 类详解 使用表单模板 回到顶部 构建一个表单 假设你想在你的网站上创建一个简单的表单,以获得用户的名字.你需要类似这样的 ...
- Django之form表单详解
构建一个表单 假设你想在你的网站上创建一个简单的表单,以获得用户的名字.你需要类似这样的模板: <form action="/your-name/" method=" ...
- AngularJS开发指南6:AngularJS表单详解
表单控件(input, select, textarea )是用来获取用户输入的.表单则是一组有联系的表单控件的集合. 用户能通过表单和表单控件提供验证的服务,知道自己的输入是否合法.这样能让用户交互 ...
- HTNL表单详解
HTML表单 表单的结构 表单的标签:<form> </form> 常用属性 Name , method(get,post), action(服务器的接收的页面如:reg.ph ...
- 七、React表单详解 约束性和非约束性组件 input text checkbox radio select textarea 以及获取表单的内容
一.约束性和非约束性组件: 非约束性组: MV: <input type="text" defaultValue="a" /> 这个 default ...
- vue表单详解——小白速会
一.基本用法 你可以用 v-model 指令在表单 <input> 及 <textarea> 元素上创建双向数据绑定. 但 v-model 本质上不过是语法糖.它负责监听用户的 ...
- HTTP头部POST表单详解
2 POST /hello/checkUser.html?opt=xxx HTTP/1.1 方法的声明,Get,Post,Delete等 3 Accept: */* 4 Referer: http:/ ...
- from表单详解
- 表单:!!!常用JS: form 表单代码
手机(文本框): <input type="text" name="" maxlength="11" placeholder=&quo ...
随机推荐
- 阶段5 3.微服务项目【学成在线】_day17 用户认证 Zuul_06-用户认证-认证服务查询数据库-Bcrypt介绍
演示MD5加密的方式 数据库内的数据密码虽然都是6个1但是 每次加密出来的字符串是不一样的 加盐 测试BCrpty 循环10次加密 密码的校验 比人工的加盐要方便的多 这是创建的一个Spring的Be ...
- 阶段5 3.微服务项目【学成在线】_day17 用户认证 Zuul_05-用户认证-认证服务查询数据库-调用查询用户接口
用户认证服务调用根据账号查询用户的信息 怎么远程调用呢?要创建一个客户端,这个客户端其实就是一个接口 标明服务的名称是ucenter服务 这是ucenter服务里面 复制过来接口的定义,GetMapp ...
- Qt编写输入法V2019终极版
一.前言 之前写过的V2018版本的输入法,本来已经很完善了,不打算更新升级了,最近有个朋友找我定制一个输入法,需要高仿一个苹果MAC电脑的输入法,MAC操作系统的审美无疑是相当棒的,于是乎直接拿以前 ...
- 性能测试-Linux资源监控⽅式
Linux资源监控⽅式 1. 命令 2. 第三⽅⼯具(nmon) 3. LR(需要安装RPC相应服务包和开启服务)(略) ⼀.命令 ⽅式 1. top (系统资源管理器) 2. vmstat (查 ...
- 反查BOM, 找出它的上阶
转自:https://blog.csdn.net/zhongguomao/article/details/80172441 查询物料的上阶方法有三: 1. CS15 可直接查出物料的上阶直至顶阶物料 ...
- DB2学习笔记备忘 2018.5.9
DB2安装的时候选择了和系统用户一致的选项,然后登陆的时候,连接的时候输入的就是计算机用户的用户名和密码. 1.3 DB2数据库体系结构 系统 一个系统表示DB2的一个安装.在一个由很多及其组成的网络 ...
- JQuery.BlockUI使用方法举例
JQuery.BlockUI是众多JQuery插件弹出层中的一个,它小巧(原版16k,压缩后10左右),容易使用, 功能齐全,支持Iframe,支持Modal,可定制性高也意味他默认谦虚的外表. jQ ...
- 【ARM-Linux开发】Rico Board上编译USB WiFi RT3070驱动
1.附件中提供了RT3070驱动源码包DPO_RT5572_LinuxSTA_2.6.1.3_20121022.tar.gz和编译好的驱动,这里选择使用taget_file.tar.gz中已经编译好的 ...
- 最新 东方财富java校招面经 (含整理过的面试题大全)
从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.东方财富等10家互联网公司的校招Offer,因为某些自身原因最终选择了东方财富.6.7月主要是做系统复习.项目复盘.Leet ...
- Qt 和 Boost关于信号和槽的对比说明
对比 无论是 Qt 的实现方式还是 Boost 的实现方式,除了必须的定义信号和槽的类之外,都不需要额外的类. 两种实现都解决了类爆炸的问题.下面让我们对照着来看一下我们前面的分析. 两个不同的术语以 ...