我的当前代码将输入字段边框的颜色更改为绿色(如果它是有效的电子邮件),如果是无效的电子邮件则更改为红色。
HTML:
<input class="ui_input2 no_space" id="input_email" type="email" name="email" style="height:25px; width:300px; font-size:16px;" required />
jQuery的:
$(document).ready(function() {
$('#input_email').keyup(function() {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
var val_i_email = $("#input_email").val();
var empty = false;
$('#input_email').each(function() {
if (val_i_email < 5 || !emailReg.test(val_i_email)) {
empty = true;
}
});
if (empty) {
$(this).addClass("invalid");
$(this).removeClass("valid");
} else {
$(this).addClass("valid");
$(this).removeClass("invalid");
}
});
});
键入时所有内容都能正常工作,但如果单击某个选项(例如:以前使用的电子邮件),除非您稍微编辑了文本,否则边框的颜色似乎不会改变。
截屏:
我点击了上面突出显示的选项。结果如下: -
单击自动建议的选项时,是否有办法再次运行其他功能或相同的功能?
jsfiddle
答案 0 :(得分:1)
只需使用oninput
代替keyup
$('#input_email').on('input',function(e){
...
});
http://jsfiddle.net/ouadie/7bmrb/3/
注意: Internet Explorer中版本支持oninput事件 9. more informations
答案 1 :(得分:0)
我建议使用on()
绑定多个事件,尝试覆盖注册条目的用户事件范围:
$('#input_email').on('change input paste keyup', function(){
/* do things here */
});