相对于 HTML4 来说，HTML5中的元素与特性提供更大程度上的语义标记，同时还删除了大量在 HTML4 中因为脚本与样式缘故而存在的冗余元素。通过让表单在不同网站上表现的更加一致，及时响应用户输入的数据，HTML5的表单特性为用户提供了更好的使用体验。这些体验同样适用于那些禁用了浏览器脚本的用户。这个话题会描述那些被 Gecko/Firefox4 或更高版本所支持的一些新特性或者改变的部分。<input> 元素<input> 的 type 特性拥有更多的...
1.创建表单的基本语法格式如下：<from action=”url 地址”method=”提交方式”name=”表单名称”>各种表单控件 </form>如下例子：P212-213 <!doctype html> <html> <head> <meta charset=”utf-8”> <title>创建表单</title> </head> <body> <from action=”http://www.mysite.cn/index.asp”method=”post” id=”formBox”autocomplete=”on”>用户名：<input type=”text”id=”autofirst”name=”autofirst”/><br/><br/>账号...
本章介绍HTML 5 的新的表单属性。新的form属性：autocomplete、novalidate。新的input属性：autocomplete、autofocus、form、form overrides (formaction, formenctype,formmethod, formnovalidate, formtarget)、height和width 、list、min, max和step 、multiple 、pattern (regexp) 、placeholder 、required 。浏览器支持autocomplete属性autocomplete属性规定form 或input 域应该拥有自动完成功能。例如：<!DOCTYPE HTML> <ht...
HTML 5 的新的表单元素：HTML 5 拥有若干涉及表单的元素和属性。本章介绍以下新的表单元素：datalist、keygen及output。datalist元素datalist元素规定输入域的选项列表。列表是通过datalist内的option元素创建的。如需把datalist绑定到输入域，请用输入域的list 属性引用datalist的id。例如：<!DOCTYPE HTML> <html> <body> <form action="demo_form.php" method="get"><input type="url" list="url_list" name="link" /><datalist...
1. 输入类型和输入属性 菜鸟教程上给出了HTML5新增加的input输入类型，可以在上面尝试一下不同类型的样子，基本可以满足日常开发需求了。类型不同会照成什么内在差异呢？主要有三点，首先，浏览器会根据输入类型进行基本的数据校验，例如type="email"，如果用户输入的内容不包括@符号，那么这就是不合法的输入，浏览器会给出相应的提示。不同类型的第二点影响就是在移动端上，在浏览器上浏览页面时，如果输入项类型不同，设备给...
时光车轮滚滚碾来,前端之路永无止歇.对于这个前端这门精一多专的技术,任何一次技术革新,我们都必须第一时间去了解它学习它,比如Web世界里这簇美艳的花朵---HTML 5.虽然HTML 5发布之初,许多人(包括我)都觉得普及它还很遥远,但自发布以来,许多企业级网站对它的尝试应用(比如应用,比如canvas的应用),使HTML 5的迈出了一大步,随之而来IE9的发布,无疑又让我们看到了HTML 5离我们不再遥远.学习HTML 5半年有余了,虽然对它的离线存储以及ca...
一、前言一撇 其实关于HTML5的表单特征早在去年“你必须知道的28个HTML5特征、窍门和技术”一文中就有所介绍，不过，有些遗憾的是，此部分的介绍是以视频形式展示的，其实，是视频还好啦，关键是TouTuBe视频，需要越狱观看。得，像我这样安分守已的良民，除了看空姐，其他情况都是懒得fan墙的，所以这部分视频展示的内容，其实就是个“空”。 所以，这里打个补丁，把这部分内容完善下。本文的大致内容有：# # # 以及其他时间选择器...
今天给大家秀一款带有发光动画的HTML5表单，挺酷的，效果图如下： 当表单获取焦点时，表单四周就会呈现出发光动画的效果，并不断地进行颜色渐变；当表单失去焦点时，停止发光。其中颜色渐变的动画只有基于webkit的浏览器才有效果，比如chrome和safari。下面简单贴一下实现这个发光HTML5表单的CSS代码和HTML代码，如果你喜欢可以将它分享给你的朋友。HTML代码如下：<div class="rain"><div class="border start"><form><label for=...
在线演示 在线下载谷歌快速搜索自带大量自动完成插件——库中甚至还有一个附带的jQuery UI共享选项。然而今天我要寻找一个替代的解决方案。由DevBridge开发的jQuery Autocomplete插件有确切的功能，我觉得非常有吸引力。你在打字的时候，结果将出现在下拉菜单底部，自动突出显示的词语。本教程简单介绍了通过加载JavaScript数组的内容运行这个插件。从后端文件加载Ajax内容或者从数据库中加载文本内容都是可行的，在本教程中，更容...
JQ-idealforms的是一个小的框架来构建很棒响应HTML5表单。特点:充分响应键盘支持可自定义的输入类型选择，单选，多选和文件表单输入提示自定义日期选择器在线验证validation支持:浏览器: IE8+, Webkit, Firefox, Opera, iOS5+, Android 4.0+jQuery: 1.7+, UI 1.8+许可证: GPL or MIT<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script src="http://code.jquery.com/ui/1.9.0/jquery-ui.min.js"></script...
FormData 对象，可以把form中所有表单元素的name与value组成一个queryString，提交到后台。在使用Ajax提交时，使用FormData对象可以减少拼接queryString的工作量。使用FormData对象1.创建一个FormData空对象，然后使用append方法添加key/valuevar formdata = new FormData(); formdata.append(name,fdipzone); formdata.append(gender,male);2.取得form对象，作为参数传入到FormData对象<form name="form1" id="form1"> <input typ...
在HTML5增强的元素中，最值得关注的就是表单元素。在HTML5中，表单已经做了重大的修整，一些以前需要通过JavaScript编码实现的功能现在无需编码就可轻松实现。在开始讨论之前，需要注意一点： 在HTML5中，表单控件是可以处于其所属的一个或多个表单的外部的。所以，表单控件像fieldset，label，input这些都加入了form属性，用于标识表单控件所属的表单。 在HTML5中： 1. form元素自身增加了两个新的属性：autocomplete和novalidate...
效果图如下： html源码： 代码如下: css源码： 代码如下: body{ background:url(bg.jpg) repeat; font-family:Arial Narrow, Arial, sans-serif; margin:0; padding:0; } header, section, footer{ display:block; } header{ width:100%; background-color:rgb(0, 0, 0); background-color:rgba(0, 0, 0, 0.9); color:#ccc; padding:15px 0; letter-spacing:1px; margin-bottom:20px; position:relative; } header h...
HTML中与form有关的东东 新增属性个人理解formhtml5之前，表单内的从属元素需要放入标签中，现在可以为标签指定form标签即可点评：该功能解决了我们实际中遇到的一些问题，比如iframe模拟异步图片上传时，就必须将图片写到form外。formactionformmethod该属性用于按钮（submit）让表单提交页面可又按钮控制formmethod指定各按钮提交方式placehoder该属性非常有用，用于文本框中显示提示信息，非常有用的一属性listlist属性需要与da...
1、邮箱的自动验证 只需要type=“email” 2、日期的验证（年月日）：type="date" 3、时间的验证（格式：00:00）：type="time" 4、数字的验证 (可以向上加 向下减)type="number" 5、月份（--年--月）type="month" 6、周（--年--周）type="week" 7、range(范围0-100) type="range" 8、search type="search" 9、颜色的颜色大全：type="color" 10、url验证 (必须前面有http://---) type="url" 代码如下: url: 用户名： html...