html5-表单常见操作

<form  autocompelate="on" id="from1">
<!--常用属性-->
邮件:<input type="email">
地址:<input type="url">
电话:<input type="tel"><!--不支持-->
数字:<input type="number" min="1" max="10" step="2">
进度条:<input type="range" min="1" max="10" step="2">
颜色:<input type="color"><!--不支持-->
时间:<input type="date"><!--不支持-->
月:<input type="month"><!--不支持-->
周:<input type="week"><!--不支持-->

<!--文本自动打开自动获取焦点-->
<input type="text" autofocus="autofocus">

<!--文本下拉列表开始-->
<input type="text" list="taglist">
<datalist id="taglist">
<option>wuban</option>
<option>baidu</option>
</datalist>
<!--说明:<form  autocompelate="on">加上此属性当输入时自动会关联-->
<!--文本下拉列表结束-->
<!--对不同网页提交-->
<input type="text"  formaction="index.php">
<!--批量上传_默认支持单个,multiple="multiple"批量上传属性-->
<input type="file" multiple="multiple">
<!--对文本启用正则_当不合格时候会弹出提示-->
<input type="text" pattern="{0-9}{6}" title="请输入电话号码">
 <!--对文本框开启默认提示-->
  <input type="text" placeholder="请输入用户名">
   <!--文本不能为空-->
 <input type="text" required="required">
提交:<input type="submit">
</form>
<!--放在表单外提交  form="from1"是当前表单FROM的ID-->
<input type="text" form="from1">
<!--隐藏-->
<p hidden="hidden">xxx</p>

时间: 2024-08-26 10:23:26

html5-表单常见操作的相关文章

实现跨浏览器html5表单验证

div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: right; clear: right; } .clearfix:after{ content: ""; display:block; clear: both; } .figcaption{ clear: both; color: #999; padding-top: 10px; text

HTML5表单及其验证

随笔- 15 文章- 1 评论- 115 HTML5表单及其验证 HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其API,方便我们做更复杂的应用,而不用借助其它Javascript框架,先说下表单的几个基本知识点: 表单仍是以<form>元素作为容器,我们可在其中设置基本的提交特性: 当用户提交页面时,表单仍然向服务器发送表单控件的值: 之前老版本中的表单控件,如text radio checkbox等等,都可以按

jQuery html5Validate基于HTML5表单验证插件

一.前言 前3篇文章实际都是为本文做铺垫的,如果以下棋表示,前三篇是普通走棋,本篇是将军! 目前市面上有不少表单验证插件,看似强大,实在糟糕! 总结下,有以下一些问题: 过多干预包括:改变了表单元素UI, 为表单元素绑定过多事件等 布局等限制包括:需要特定结构的布局,需要特定的类名或者ID 学习成本包括:N多元作者自定义的属性,或者自定义的特定的数据结构 可用性 当JS出现错误的时候而无法正常运作的时候,验证就是聋子的耳朵——摆设,即使在现代浏览器下也是如此. 面向未来的表单验证 验证驱动验证信

HTML5表单的创建及与PHP的交互

Html5表单 <!DOCTYPE html> <html> <head lang="en">     <meta charset="UTF-8">     <title></title> </head> <body> <form>     用户名:     <input type="text">     <br/>

菜鸟零基础学习HTML5 &nbsp; ----- 1.5、HTML5表单和PHP环境搭建

一.HTML5表单 1.表单用于获取不同类型的用户输入 2.常用表单标签 例: <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>表单</title> </head> <body>     <form>         用户名:         <i

服务器变量 超级全局数组$_SERVER (附加超简单表单与html5表单属性)

001.html <html> <head><title>user log</title> <meta http-equiv="content-type" content="text/html;charset:utf-8"> </head> <body> <form method="post" action="001.php"> 用

待整理笔记(表单序列化操作、多态函数、对象的状态队列管理模式)

1.jquery的表单序列化操作 $('.form').serializeArray();通过serializeArray()方法得到表单form(class=“form”)的dom结点下所有含有name值的节点的value值的一个数组; 这个数组由多个对象构成,每个对象有name和value两个key值. 2.编程的多态性思想 利用函数的参数数组arguments,通过判断数组的长度来选择性执行某个功能: 例如: store: function(namespace, data, remove)

04. Web大前端时代之:HTML5+CSS3入门系列~HTML5 表单

Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html ? 待续.... 04. Web大前端时代之:HTML5+CSS3入门系列~HTML5 表单

HTML5表单新增属性

------------------siwuxie095 HTML5 表单新增元素与属性 1.form 属性 在 HTML4 中,表单内的从属元素必须书写在表单内部,而 在 HTML5 中,可以把它们书写在页面上任何地方,然后为 该元素指定一个 form 属性,属性值为该表单的 id,这样就 可以声明该元素从属于指定表单了 2.formaction 属性 在 HTML4 中,一个表单内的所有元素只能通过表单的 action 属性被统一提交到另一个页面,而在 HTML5 中,可以为所有 的提交按钮

加速HTML5应用的九大方法-------1.使用HTML5表单和输入框

加速HTML5应用的九大方法-------1.使用HTML5表单和输入框HTML5 引入很多全新的表单属性和输入框类型,虽然并不是所有的浏览器都支持,但它们的确都很有用:autofocus 使得页面加载完毕后自动为某个输入框设置输入焦点placeholder 允许你为输入框设置默认文本,并在获取焦点时自动清除required 属性要求必须填写值后才能提交表单pattern 可以通过正则表达式指定输入框允许输入的内容因为这些功能都是内置的,无需使用 JavaScript 方法来实现,第一是节省开发