Html笔记(七)表单
表单标签: <form>
表单标签是最常用的标签,用于与服务器端的交互。
<input>:输入标签;接受用户输入信息
其中type属性指定输入标签的类型
- 文本框 text:输入的文本信息直接显示在框中。
- 密码框 password:输入的文本以圆点或者型号的形式显示。
- 单选框 radio:如:性别选择。
- 复选框 checkbox:如:兴趣选择。
- 隐藏字段 hidden:在页面上不显示,但在提交的时候随其他内容一起提交。
- 提交按钮 submit:用于提交表单中的内容。
- 重置按钮 reset:将表单中填写的内容设置为初始值
- 按钮 button:可以为其自定义事件。
- 文件上传 file :后期扩展内容,会自动生成一个文本框,和一个按钮。
- 图像 image 它可以替代 submit 按钮
<select>:选择标签,提供用户选择内容。如:用户所在省份。size属性为显示项目个数。
<option>:子项标签,属性 selected 没有属性值,加在子项上,其中一个子项上,子项就变成默认被选项。
<textarea>:多行文本框,如:个人信息描述。
<label>:用于给各元素定义快捷键。
for 属性:指定快捷键作用的表单元素。必须与要作用的表单元素的 id 值相同。
accesskey 属性:指定快捷键,此快捷键需要和 alt 键组合使用。
例:
<tr>
<td><label accesskey="u" for="userid">用户名</td>
<td><input type="text" name="user" id="userid"/></td>
</tr>
表单提交:
- 先定义 form 表单中的 action属性值,指定表单数据提交的目的地(服务端)。
- 明确提交方式,通过指定 method 属性值。如果不定义,那么 method 的值默认是 get。
get和post这两种最常用的提交方式的区别:
- get提交将数据显示在地址栏,对于敏感信息不安全。post提交不显示在地址栏。
- 地址栏中存放的数据是有限的,所以 get 方式对提交的数据体积有限制。post可以提交大体积数据。
- 对提交数据的封装方式不同:get:将提交数据封装到了消息头前面,请求行中。post:将提交的数据封装到消息头后,数据体中。
- 注意:
- 通常表单使用post提交,因为编码方便。对于Tomcat服务器端,默认的解码方式是ISO8859-1,那么中文会出现乱码。通过post提交,可以使用 request.setCharcterEncoding("GBK");来解决乱码问题,该方法只对数据体有效
- 如果是 get 提交,request.setCharcterEncoding("GBK");对乱码问题解决不了,必须先进行ISO8859-1编码,然后在进行GBK的解码。这种方式虽然对post提交的乱码也通用,但是麻烦,所以建议表单提交使用 post。
例子:
<fieldset>
<legend>注册区域</legend>
<form action="http://127.0.0.1:8888" method="post">
<table border="5" width="75%" cellpadding="10" cellspacing="0" bordercolor="#3399FF">
<tr>
<td colspan="2" align="center"><b>信息注册页面</b></td>
</tr> <tr>
<td><label accesskey="u" for="userid">用户名</td>
<td><input type="text" name="user" id="userid"/></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" name="passwd"/></td>
</tr>
<tr>
<td>确定密码</td>
<td><input type="password" name="passwd_conform"/></td>
</tr>
<tr>
<td>性别</td>
<td>
<input type="radio" name="sex" value="man"/>男
<input type="radio" name="sex" value="woman" />女
</td>
</tr>
<tr>
<td>技术</td>
<td>
<input type="checkbox" name="tech" value="java" />Java
<input type="checkbox" name="tech" value="jsp" />Jsp
<input type="checkbox" name="tech" value="servlet" />Servlet
</td>
</tr>
<tr>
<td>国家</td>
<td>
<select name="country">
<option>--选择国家--</option>
<option value="cn">中国</option>
<option value="en">英国</option>
<option value="usa">美国</option>
</select>
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="submit"/>
<input type="reset" value="reset"/>
</td>
</tr> </table>
</form>
</fieldset>
安全问题:
暴力提交、暴力注册
<a href=”http://注册地址?name=value&id=value......”>暴力开始</a>
超链接默认就是get方式提交
客户端首先进行数据有效性校验,服务端对客户端提交的数据必须再次校验
Html笔记(七)表单的更多相关文章
- And Design:拓荒笔记——Form表单
And Design:拓荒笔记——Form表单 Form.create(options) Form.create()可以对包含Form表单的组件进行改造升级,会返回一个新的react组件. 经 For ...
- 玩转Django2.0---Django笔记建站基础七(表单与模型)
第七章 表单与模型 表单是搜集用户数据信息的各种表单元素的集合,作用是实现网页上的数据交互,用户在网站输入信息,然后提交到网站服务器端进行处理(如数据录入和用户登录.注册等). 用户表单是web开发的 ...
- AngularJS 1.2.x 学习笔记(表单校验篇)
https://my.oschina.net/cokolin/blog/526911 摘要: 本文首发于 blog.csdn.net/vipshop_ebs/article/details/39472 ...
- Bootstrap学习笔记(二) 表单
在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...
- vue学习笔记(六)表单输入绑定
前言 在上一章vue学习笔记(四)事件处理器这一篇博客的内容中,我们已经了解vue是如何绑定事件的,而本篇博客主要讲解的是vue中表单输入的绑定,通常我们自己提交信息的时候都是通过表单将信息到服务器的 ...
- iOS开发笔记11:表单键盘遮挡、浮点数价格格式化显示、省市区选择器、View Debugging
1.表单键盘遮挡 应用场景为一个collectionView上有多个textfield.textView供用户填写信息. 之前输入项较少时,采取的方法比较粗暴,didSelectItemAtIndex ...
- HTML5自学笔记[ 3 ]表单验证反馈
表单控件对象的validity对象可以设置或返回相关的验证信息(在invalid事件处理中获取validity对象): 属性valid:为true所有验证通过,为False至少有一种验证失败. 属性v ...
- Symfony2学习笔记之表单
对于一个Web开发者来说,处理HTML表单是一个最为普通又具挑战的任务.Symfony2集成了一个Form组件,让处理表单变的容易起来.在这一节里,我们将从基础开始创建一个复杂的表单,学习表单类库中最 ...
- [学习笔记]--Jfinal 表单提交附件
近期.项目里面用到了Jfinal 里面的上传附件. Jfinal 的Controller 里面提供了一个 getFile系列方法提供文件上传. 我这里呢,是文件上传和表单參数一起提交. 页面类似下图: ...
随机推荐
- composer php依赖管理工具
#composer是什么 Composer 是 PHP 的一个依赖管理工具.它允许你申明项目所依赖的代码库,它会在你的项目中为你安装他们. composer出现之前我们php项目依赖管理大部分都是手动 ...
- 使用.htaccess进行浏览器图片文件缓存
对于图片类网站,每次打开页面都要重新下载图片,慢不说,还非常浪费流量.这时就需要用到缓存,强制浏览器缓存图片文件 缓存文件,提问网站访问数度,减少流量消耗,现提供2中缓存代码 打开.htaccess文 ...
- JAVA学习资料整理
今天偶然间发现之前一个群里发过的一篇关于JAVA学习资料的东西.本着服务大众的精神,搬来了博客园: <JAVA编程思想>第四版(英文原版) 下载地址:http://115.com/file ...
- linux安装mysql出现Could NOT find Curses (missing CURSES_LIBRARY CURSES_INCLUDE_PATH),提示解决方法
[root@localhost mysql-5.5.11]# cmake . 出现以下错误提示: -- Could NOT find Curses (missing: CURSES_LIBRARY ...
- SDC(5)–FPGA系统级同步输入的约束
此时计算最大/最小输入延时时,是不应该考虑FPGA本身的tSU/tH的,因为数据进来之后不一定马上送到DFF. 例如: 此时约束如下:
- android报表图形引擎(AChartEngine)demo解析与源码
AchartEngine支持多种图表样式,本文介绍两种:线状表和柱状表. AchartEngine有两种启动的方式:一种是通过ChartFactory.get***View()方式来直接获取到view ...
- <一> MVC - HtmlHelper
HtmlHelper类位于System.Web.Mvc.Html之中主要有七个静态类组成: FormExtensions - BeginForm, BeginRouteForm, EndForm In ...
- Xcode 调试技巧-b
随着Xcode 5的发布,LLDB调试器已经取代了GDB,成为了Xcode工程中默认的调试器.它与LLVM编译器一起,带给我们更丰富的流程控制和数据检测的调试功能.LLDB为Xcode提供了底层调试环 ...
- Android开发(一):环境搭建
引言 本系列将记录我在步入Android开发过程中的一些流水账及经验,如有疏漏,还望不吝赐教. 目录 1.JDK安装及配置 2.Eclipse.Android SDK ADT安装及配置 正文 1.JD ...
- 李洪强漫谈iOS开发[C语言-017]-printf函数