HTML表单文本框动态信息框?

时间:2015-01-18 18:40:36

标签: html css forms dynamic popup

我最近几次谷歌搜索了我正在寻找的东西,但我不知道我正在寻找的正确名称,这几乎不可能得到结果。让我试着解释一下:

我在网站上看到过表格注册,用户点击了电子邮件"字段旁边会出现一个弹出信息框,上面写着"请输入有效的电子邮件..."如果用户移动到下一个框并且电子邮件ISN有效,则该框变为红色并显示类似"请输入有效的电子邮件。"如果电子邮件已被拍摄,则该框变为红色并表示已拍摄,他们需要输入另一个电子邮件。如果它满足所有要求,则该框消失,下一个框将弹出询问用户名,检查用户名是否唯一等,等等。最后,当需要密码时,它会动态检查密码是否匹配,如果不匹配,信息框会再次变为红色。

有没有人理解我想要完成的事情?

1 个答案:

答案 0 :(得分:1)

我认为你要求的术语是form validation。 网上有无数与此相关的例子,它们有许多不同的方式来验证表格。 对于上面提到的email字段,您需要使用required属性(感谢HTML5,这非常简单),其中浏览器可用于验证(在有限的范围内)时尚)电子邮件地址
基本示例

Email Address: <input type="email" name="email" required placeholder="Enter a valid email address">

由Scratch Visual Reference制作

您可以使用基本HTMLCSS来完成。这是我做的 JSFiddle http://jsfiddle.net/aZ9r8/331/

Javascript库

这是http://www.parsleyjs.org上流行的Javascript图书馆。