html表单的作用_HTML基本知识

html中表单的应用　　2、表单 * 　　表单作用：　　用于显示、收集信息，并将信息提交到服务器　　表单两大部分：　　1、实现数据交互的可见界面素，即表单控件　　2、提交表单后的处理操作　　1、如何实现表单　　语法：<form></form> 　　特点：没有任何显示效果，默默的帮助网页完　　成信息提交的功能　　属性: 　　1、action 　　动作、行为　　表单要提交的服务器处理程序地址，通常都是由后台处理程序完成(JSP,php,aspx java) 　　<form action=”test.java”></form><form action=”#”></form> 　　默认值：本页　　2、method 　　提交方式　　取值:get或post 　　get:（得到，）会将提交的信息全部显　　示在地址栏上(明文提交)。大小限制为2KB。　　使用场合：向服务器索取信息时，推荐使用get 　　提交方式，比如，百度搜索、各个网站的搜索栏　　post:隐式提交，所提交的数据不会显示在地址栏上，安全性较高。并且没有提交数据的大小限制。　　使用场合：　　1、提交数据量较大时，上传头像、文档等　　2、提交安全性要求较高的数据时，比如密码等　　如果想将数据提交给服务器进行处理时，可以使用post，如登录、注册。。　　默认值：get 　　3、name 　　定义表单名称　　4、id 　　定义表单唯一标识　　注意：name 和 id ，最终表单的方式不同而已。　　5、enctype 　　表单数据编码方式　　1、application/x-www-form-urlencoded 　　默认值,能够提交普通数据(包含特殊符号 & , = , ?)，无法提交文件　　2、multipart/form-data 　　将所有内容都拆分成二进制进行提交转字节　　10 –》2 -》有电　　abc –>unicode编码–》字节—》2 –》电脑 1个字母有几个字节 2 97–》a 　　utf-8—》unicode 　　0 1 二极管没电有电物质 ——-》　　支持文件上传　　3、text/plain 　　只负责提交基本数据，不包含任何特殊字符的数据　　尽量不用，有可能数据提交不完整　　2、表单控件　　具备可视化外观的html素，并且能够接受用户输入的信息。而且表单控件中的数据是允许提交给服务器的。　　表单控件：　　1、input素　　语法：<input /> 　　属性：　　1、type,根据不同的type值，可以创建　　各种类型的输入控件　　2、value,控件的值,允许将value的值提　　交给服务器　　3、name,控件的名称,服务器使用　　4、id,控件的唯一标识,本页面使用　　5、disabled :禁用控件　　<input id=”value” disabled /> 　　1、文本框与密码框　　文本框:<input type=”text”/> 　　密码框:<input type=”password” /> 　　属性：　　maxlength:限制输入的字符数　　readonly:只读　　name和id的命名规范：　　使用匈牙利命名法　　text –> txt 　　password –> txt 　　type缩写作用名称　　2、单选框和复选框　　单选框：<input type=”radio”> 　　复选框：<input type=”checkbox”> 　　属性：　　checked : 设置默认被选中　　注意：name属性，一组单选框或复选框，name属性要设置为一致的。　　一组中，只能有一个素被选中　　radio –> rdo,rdoGender 　　checkbox –> chk,chkHobby 　　3、按钮　　1、提交按钮　　固定功能，将表单控件的数据提交到服务器指定的处理程序(action)上　　<input type=”submit” value=”按钮上的文字” /> 　　2、重置按钮　　固定功能，将表单控件的值都设置为默认值。　　<input type=”reset” value=”按钮上的文字” /> 　　3、普通按钮　　由用户来定义功能　　<input type=”button” value=”按钮上的文字” /> 　　<button>显示的文字</button> 　　4、隐藏域和文件选择框　　1、隐藏域　　表单中，包含不希望用户看到的并且需要提交给服务器的信息，可以放在隐藏域中　　<input type=”hidden” /> 　　2、文件选择框　　允许用户选择要上传的文件　　<input type=”file” name=”” /> 　　注意：　　1、表单的 method 属性值必须为 post 　　2、enctype的值必须为 multipart/form-data 　　2、其他素　　1、<label>素　　关联文本与表单素，文本的时候相当于了表单素一样　　语法：<label>文本</label> 　　属性：for 　　表示与该label相关联的控件的id值　　2、选项框(下拉列表框) 　　两种：　　1、下拉选项框　　2、滚动列表　　语法：　　选项框：　　<select></select> 　　属性：　　name: 　　id: 　　size:默认1，如果大于1则为滚动列表　　multiple:多选　　选项：　　<option value=”选项的值” selected>显示的文本　　</option> 　　3、textarea素　　文本域，多行文本框素　　语法：　　<textarea> 　　多行文本　　</textarea> 　　属性：　　name 　　cols:指定文本区域的列数(宽度) 　　rows:指定文本区域的行数(高度) 　　以上两个属性，以字符数作为值　　readonly:只读　　4、为控件分组　　语法：　　分组：　　<fiedset> 　　素　　</fieldset> 　　标题：　　<legend></legend> 　　<!–修改个人信息开始–> <div> <h1>修改个人信息</h1> <form action=”java文件” method=”get” name=”form1″ id=”form1″> 姓名：<input type=”text” size=”20″ placeholder=”marry” />  ▶ 各项<mark>技能</mark>指数<br /><br /> 性别：<input type=”radio” />男 <input type=”radio” />女<br /><br /> 学历： <select id=”edu” name=”userEdu”> <option value=”other” selected/>其他</option> <option value=”dz”>大专</option> <option value=”bk”>本科</option> <option value=”ss”>硕士</option> </select><br /><br /> 意向工作城市： <select id=”city” name=”userCity” multiple=”multiple”> <option value=”other” />其他</option> <option value=”bj”>北京</option> <option value=”sh”>上海</option> <option value=”zz”>郑州</option> </select><br /><br /> 个人描述 <textarea cols=”20″ rows=”10″></textarea> <br /><br /> <input type=”checkbox” />不要公开我的个人信息<br /><br /> <input type=”submit” value=”保存” /> <input type=”reset” value=”重置”/> </form> </div> <!–修改个人信息结束–> 　　

html表单的作用_HTML基本知识

相关推荐