作为学习的记录,方便大家查看,废话不多说,直接上代码
html 结构:
jq代码:
$("form :input.required").each(function(){ var $required = $('*'); $(this).parent().append($required); }); $("form :input").blur(function(){ var $parent = $(this).parent(); $parent.find(".formtips").remove(); //删除多余重复 // 验证用户名 if($(this).is('#username')){ if(this.value == ""|| this.value.length<6 ){ var errorMsg = "请输入6位用户名" ; $parent.append($(''+errorMsg+'')); }else{ var okMsg = "输入正确"; $parent.append($(''+okMsg+'')); } } // 验证邮箱 if($(this).is('#email')){ if(this.value == "" ){ //|| (this.value!="" && !/.+@.+\.[a-zA-Z] {2,4}$/.test(this.value) var errorMsg = "请输入正确的E-mail" ; $parent.append($(''+errorMsg+'')); }else{ var okMsg = "输入正确"; $parent.append($(''+okMsg+'')); } } }).keyup(function() { $(this).triggerHandler('blur'); }).focus(function(){ $(this).triggerHandler('blur'); }); $("#send").click(function(){ $("form .required:input").trigger('blur'); var numError = $("form .onError").length; var $id = $("form .onError").prevAll(".required").attr("id"); if(numError){ if(numError > 1){ $("#username").focus(); }else if($id == "email"){ $("#email").focus(); } return false; } alert("注册成功,密码已发送到你的邮箱,请查收"); });
学习代码是需要多跑几遍的!