html结构，用到了label与span
<label class="relative"><input type="text" name="name" id="name" class="colorblur" size="40" value="{sh:$info.name}"/><span class="msg_dialog"></span></label>
添加样式
.relative{
position: relative;
font-weight: normal;
}
.msg_dialog{
display: block;
width:200px;
height:auto;
position: absolute;
right:-200px;
top:5px;
color:red;
overflow: hidden;
}
表单添加checkForm()
<form action="{sh::U('User/addAgent')}" method="post" id="myform" onsubmit="return checkform();">
function checkform(){
if($("#name").val() == ''){
showdialog($("#name"),"姓名不能为空");
$("#name").focus();
return false;
}
var email_val = $("#email").val();
if(email_val == ''){
showdialog($("#email"),"邮箱不能为空");
$("#email").focus();
return false;
}
reg=/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
if(!reg.test(email_val)){
showdialog($("#email"),"邮箱不合法");
$("#email").focus();
return false;
}
// ajax email是否已存在
if(ajaxCheck('email',email_val) == 1){
showdialog($("#email"),"邮箱已存在,请勿重复添加");
$("#email").focus();
return false;
}
var tel_val = $("#tel").val();
if(tel_val == '' || tel_val.length != '11'){
showdialog($("#tel"),"手机不能为空或手机号有误");
$("#tel").focus();
return false;
}
// ajax 验证号码是否已存在
if(ajaxCheck('tel',tel_val) == 1){
showdialog($("#tel"),"号码已存在");
$("#tel").focus();
return false;
}
var reg = /^[0-9a-zA-Z]+$/;
if($("#password").val() == '' || $("#password").val().length <6 || !reg.test($("#password").val())){
showdialog($("#password"),"密码不能为空且必须为字符或数字");
$("#password").focus();
return false;
}
if($("#map_lng").val() == ''){
showdialog($("#map_lng"),"请标注代理商位置");
return false;
}
}
showdialog() 方法负责处理提示信息
function showdialog(obj,msg){
obj.siblings(".msg_dialog").text(msg).show().delay(2000).hide(0);
}
delay(2000).hide(0) 延迟两秒后消失
ajax验证
// ajax验证邮箱号码
function ajaxCheck(t,v){
var res = '';
$.ajax({
tpye:"post",
url:"{sh::U('User/ajax','todo=checkVal')}",
data:"t="+t+"&v="+v,
async: false,
success:function(data){
res = data;
}
});
return res;
}
public function ajax(){
$todo = $this->_request('todo','trim');
switch ($todo) {
case 'checkVal':
$t = $this->_request('t','trim');
$v = $this->_request('v','trim');
if(empty($t) || empty($v)){
exit('0');
}
$agentModel = M('Agent');
if($t == 'email'){
$count_email = $agentModel->where(array('email'=>$v))->count();
if($count_email > 0){
exit('1');
}
}
if($t == 'tel'){
$count_tel = $agentModel->where(array('tel'=>$v))->count();
if($count_tel > 0){
exit('1');
}
}
break;
default:
# code...
break;
}
}
效果
两秒后红色提示将消失