2 lxh929257102 lxh929257102 于 2015.07.21 00:40 提问

input type=email 在判定失败时 如何使用自定义class

默认是在判断不是email格式的什么,输入框变红色,现在想要在判断不是email格式的时候让输入框后面多一个红色的叉叉。也就是随便弄个样式,不用默认的

各位大神请看好题目在回答,我不是为了要成功验证email,而是在type=email这个类型真正起作用的时候改变样式。至于那些让我写正则判定的,多谢了,这么简单的问题我也不好意思在CSDN上问的。我强调的是type=email,既然新出了个email类型的input肯定是让我们省去正则判定的那一步,但是如果这个新标签不让我们改样式,当然是判定后的样式,那这个新类型email也就没有意义了

5个回答

caozhy
caozhy   Ds   Rxr 2015.07.21 06:14
lxh929257102
lxh929257102 你没理解我的意思,是说怎么让判定错误后的样式变成我写的样式
接近 3 年之前 回复
yuke198907
yuke198907   2015.07.21 08:43

这个就得自己写样式了....

lxh929257102
lxh929257102 你没理解我的意思,是说怎么让判定错误后的样式变成我写的样式
接近 3 年之前 回复
a1002293285
a1002293285   2015.07.21 09:32

默认的是没有样式的,你可以在自己进行判断然后给一个样式噻。除非你使用的某个框架,不怕默认是没得提示的。

lxh929257102
lxh929257102 能好好理解type=email的意思不
接近 3 年之前 回复
showbo
showbo   Ds   Rxr 2015.07.21 10:22

onblur的时候自己用正则检查下数据是否有效,无效就显示你的xx或者添加自定义样式,注意ie8-不支持email类型

 <input type="email" onblur="this.nextSibling.style.display = this.value == '' || /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/.test(this.value) ? 'none' : ''" /><span style="display:none;color:red">X</span>
showbo
showbo 回复lxh929257102: 不知道你用过email类型没有。。浏览器的验证afe@afe这种也通过。所以你自己好好理解下和使用下这个类型。当然你允许这种格式的话,onkeyup获取xxx.validity.valid属性或者添加oninvliad事件,点击submit会触发
接近 3 年之前 回复
lxh929257102
lxh929257102 能好好理解type=email的意思不
接近 3 年之前 回复
lxh929257102
lxh929257102   2015.07.25 09:45

怎么没人回复啊,有这么难吗?

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
HTML5表单之Input 类型-email
email类型用于应该包含e-mail地址的输入域。 在提交表单时,会自动验证e-mail域的值。 eg: E-mail: xxxx E-mail: 提示:iphone中的Safari浏览器支持emaiil输入类型,并通过改变触摸屏键盘来配合它(添加@和.com选项)。
HTML5 input 类型: email及url
原文地址: HTML5′s “email” and “url” Input Types 原文日期: 2010年09月15日 翻译日期: 2013年08月13日 在前面的博文,我们已经讨论了一些HTML5改进的地方,比如placeholder,prefetching以及webStorage,下面我要介绍的是两个新的input元素类型: email和url。让我们跟着代码来看看他们的好处
css input[type=file] input[type=radio] input[type=checkbox]样式美化,input上传按钮美化
一、css input[type=file] 样式美化,input上传按钮美化 我们在做input文本上传的时候,html自带的上传按钮比较丑,如何对其进行美化呢 思路: input file上传按钮的美化思路是,将input file从页面隐藏掉,然后使用div加button等元素模拟文件上传的选择框,最后使用js触发input file的点击事件 代码如下: DOM结构:
自定义input type=”radio”样式
input type="radio" name="sex" value="man" id="man" checked> label for="man">男label> input type="radio" name="sex" value="female" id="female"> label for="female">女label> label{ position: rel
自定义input type=file 样式 美化input type=file 改变input type=file控件“丑陋面貌”
自定义input type=file 样式,美化input type=file 改变input type=file控件“丑陋面貌”
jsp常用的input type
jsp的 input 输入框分为很多种:有多选框、单选框、日期、颜色、输入限制、邮箱验证、隐藏框、文件上传等等。下面逐一展示如何使用这几个常用的input框 多选框:checkbox 多选 娱乐新闻 今日头条 滚动新闻 ***************************************************************
自定义 input type=file样式
这里采用 span标签嵌套input标签,因为div标签在ie里有问题,具体参考该文章:http://www.cnblogs.com/kongxianghai/p/5624785.html 里面很详细,代码如下: style> .fileinput-button { position: relative; display: i
自定义 input type="file" 文件上传样式
本文主要介绍如何修改原生的<input type="file">标签的显示效果,自定义实现文件上传的样式。
自定义input[type="checkbox"]的样式
对复选框自定义样式,我们以前一直用的脚本来实现,不过现在可以使用新的伪类 :checkbox 来实现。 如果直接对复选框设置样式,那么这个伪类并不实用,因为没有多少样式能够对复选框起作用。不过,倒是可以基于复选框的勾选状态借助组合选择符来给其他元素设置样式。 很多时候,无论是为了表单元素统一,还是为了用户体验良好,我们都会选择 label 元素和 input[type="checkbo
自定义input[type=radio]单选框样式
一般默认的input[type=radio]单选框样式都比较简陋,如何自定义自己喜欢的样式呢?下面来接单介绍一种。