北京中科白癜风医院骗人吗 http://www.txbyjgh.com/axhd/m/1350.html成长是一辈子的事儿！大家好！我是时问新。分享前端、Python等技术，以及个人成长路上的那些事儿。前面两篇图文介绍的表单控件，都是HTML4版本中就已经存在的表单控件，不过它们同样在HTML5规范中被兼容，而今天这一篇图文介绍的这些表单控件，都是在HTML5中新增的。在HTML5中新增的表单控件，主要有下图所示的这些，input标签的type属性不同的值，表示不同的控件。现在我在项目文件夹中新创建了一个叫HTML5新增的表单控件.html的网页，我在这个网页中演示新增控件的代码。网页结构的代码相信小伙伴们都很熟悉了，我这里就只写HTML5新增表单控件的代码。颜色选择控件p颜色选择控件：inputtype=colorname=id=/p在浏览器中显示效果如下：当你在浏览器中点击那个黑色的颜色选择按钮时，就会弹出选择颜色的对话框：这个颜色选择对话框，会根据电脑系统、手机系统的不同而不同。日期选择控件p!--日期选择控件--日期选择控件：inputtype=datename=id=/p在浏览器中显示效果如下：当你点击日期选择控件时，会弹出让你选择年月日的对话框：时间选择控件p!--时间选择控件--时间选择控件：inputtype=timename=id=/p在浏览器中显示效果如下：当你点击时间选择控件时，可以选择几点几分：电子邮件输入控件p!--电子邮件输入控件--电子邮件输入控件：inputtype=emailname=id=/p在浏览器中显示效果如下：如果仅仅是写了电子邮件输入控件的代码，你会发现在浏览器中，显示效果和单行文本框好像没什么区别。但是，实际上HTML5是非常强大的，HTML5的表单控件比包括HTML4之前的表单控件，都做了很大的增强。当你给这些表单控件外面加上form标签，再加一个提交按钮，并且当你点击提交按钮时，HTML5都会自动对用户在表单控件中输入的内容进行校验。比如如下代码：formaction=p!--颜色选择控件--颜色选择控件：inputtype=colorname=id=/pp!--日期选择控件--日期选择控件：inputtype=datename=id=/pp!--时间选择控件--时间选择控件：inputtype=timename=id=/pp!--电子邮件输入控件--电子邮件输入控件：inputtype=emailname=id=/pp!--提交按钮--inputtype=submitvalue=提交表单/p/form在浏览器中，当你在电子邮件输入控件中随便输入内容，比如我输入了，这是不符合电子邮件规范的，比如qq.
转载请注明：http://www.aierlanlan.com/grrz/7848.html
