×

深圳网站建设—APP开发—网站制作—小程序开发_博纳网络公司

0755 -
82538016
82560826
网站制作资讯

APP开发公司详解如何实现email类型文本功能

文章编辑:网站建设 文章来源:APP开发 浏览量:

  APP开发公司详解如何实现email类型文本功能,深圳APP开发公司编程工程师结合多年移动端平台搭建经验,整理出用下面的代码就可以创建一个email类型的<input>标签。
<inputtype="email"/>
这样最简单地使用时,只是在输入的时候验证是否符合最简单的email格式,在设置默认值的时候依然用value属性。<inputtype=”email”value=”xx@qq.com”/>
当value为空或没有这个属性时placeholder设置的内容才会被显示。<inputtype=”email”value=””placeholder=”请输入E-mail,如:xx@qq.com”/>
图2.3是placeholder显示的效果,灰灰的字体颜色。这里需要注意的是placeholder默认的不是灰色,而是<input>标签的color样式设置的颜色60%透明度的效果,所以如果color不是默认的黑色而是red红色,那么placeholder显示的则是淡红色。
作为一般的提示这是很有用的一个属性,另外还有一个设置光标的属性也非常有用,即autofocus。
<inputtype="email"autofocus="autofocus"/>
当同时设置了placeholder和autofocus时,placeholder会被显示,光标也会在输入框中闪烁,即获得焦点。设置了value值时,光标会出现在第一个字符前面而不是在最后面。如果一个页面有多个<input>标签设置了autofocus,那么在不同浏览器下光标的位置是不同的,比如Firefox会将光标定位在第一个设置元素上,而Chrome则定位在最后一个设置元素上。email一般作为重要资料通常是必填项目,这时required属性就派上用场了。required属性会告诉表单在提交时检查元素是否填写。
<inputtype="email"required="required"/>
除了必填以外,有时还需要更加复杂的验证,比如email的格式和长度,甚至仅限某个域名等,这时就要使用pattern属性了。<inputtype="email"pattern=".+z3f\.me$"/>
上面的代码用pattern属性限制只能用z3f.me结尾的email地址。pattern实质就是执行正则表达式。好了,APP开发公司本文关于“制作APP时
如何实现email类型文本功能”的实操步骤以及方法就分享到这里,谢谢关注,博纳网络编辑整理。
 
 

当前文章链接:/construction/appkaifa/2996.html
如果您觉得案例还不错请帮忙分享:

[声明]本网转载网络媒体稿件是为了传播更多的信息,此类稿件不代表本网观点,本网不承担此类稿件侵权行为的连带责任。故此,如果您发现本网站的内容侵犯了您的版权,请您的相关内容发至此邮箱【qin@198bona.com 】,我们在确认后,会立即删除,保证您的版权。