Code
function check()
{
checkForm.init("test","只能是数字","email");
}
var checkForm={
email:function(objValue){
return /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(objValue);
},
digital:function(objValue){
return /^[1-9]\d*$/.test(objValue);
},
str:function(objValue){
return /^\w+$/.test(objValue);
},
_err:"",
_obj:"",
_flag:true,
init:function(obj,message,checkType)
{
if(!$("#"+obj))
return;
this._obj=obj;
obj=$("#"+obj);
switch(checkType){
case "email":
if(!this.email(obj.val()))
{
this._err=message;
this.show();
}
break;
case "empty":
if(obj.val()=="")
{
this._err=message;
this.show();
}
break;
case "digital":
if(!this.digital(obj.val()))
{
this._err=message;
this.show();
}
break;
case "str":
if(!this.str(obj.val()))
{
this._err=message;
this.show();
}
break;
default:
return;
break;
}
},
show:function(){
var objPosition=this.getAbsolutePos(this._obj);
objPosition.y-=54;
var box=document.createElement("Div");
box.id="showDiv";
with(box.style)
{
position = "absolute";
top = (objPosition.y+5) + "px";
left = (objPosition.x) + "px";
}
box.appendChild(this.ShowContent());
document.body.appendChild(box);
},
hidden:function(){
var obj=document.getElementById("showDiv");
if(!obj)
return;
document.body.removeChild(obj);
},
ShowContent:function(){
var width ="-2px";
var content = document.createElement("DIV");
var contentPadder = document.createElement("DIV");
var msg = document.createElement("DIV");
this._err = "<div style=\"margin-top:15px; height:30px;\">"
+ "<div style=\"float:left;\"><img src=\"text_content-left.gif\" /></div>"
+ "<div style=\"float:left; height:24px;font-size:12px; background:url(text_content-bg.gif); line-height:24px; color:#265972;\">"
+ this._err
+ "</div>"
+ "<div style=\"float:left;\"><img src=\"text_content-right.gif\" /></div>"
+ "</div>"
+ "<div style=\"clear:both;\"></div>"
+ "<div style=\"margin-left:40px; width:80px; margin-top:-9px; position:absolute;\"><img src=\"buttom_angle.gif\" /></div>";
// }
msg.innerHTML = this._err;
with(msg.style){
overflow = "hidden";
}
contentPadder.appendChild(msg);
content.appendChild(contentPadder);
return content;
},
getAbsolutePos:function(el) {
el=document.getElementById(el);
var SL = 0, ST = 0;
if (el.scrollLeft)
SL = el.scrollLeft;
if (el.scrollTop)
ST = el.scrollTop;
var r = { x: el.offsetLeft - SL, y: el.offsetTop - ST };
return r;
}
}
</script>
<p> </p>
<p> </p>
<p>
<input type="text" id="test">
<input type="button" onclick="check()" onblur="checkForm.hidden()" value="检查有效性" />
function check()
{
checkForm.init("test","只能是数字","email");
}
var checkForm={
email:function(objValue){
return /\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*/.test(objValue);
},
digital:function(objValue){
return /^[1-9]\d*$/.test(objValue);
},
str:function(objValue){
return /^\w+$/.test(objValue);
},
_err:"",
_obj:"",
_flag:true,
init:function(obj,message,checkType)
{
if(!$("#"+obj))
return;
this._obj=obj;
obj=$("#"+obj);
switch(checkType){
case "email":
if(!this.email(obj.val()))
{
this._err=message;
this.show();
}
break;
case "empty":
if(obj.val()=="")
{
this._err=message;
this.show();
}
break;
case "digital":
if(!this.digital(obj.val()))
{
this._err=message;
this.show();
}
break;
case "str":
if(!this.str(obj.val()))
{
this._err=message;
this.show();
}
break;
default:
return;
break;
}
},
show:function(){
var objPosition=this.getAbsolutePos(this._obj);
objPosition.y-=54;
var box=document.createElement("Div");
box.id="showDiv";
with(box.style)
{
position = "absolute";
top = (objPosition.y+5) + "px";
left = (objPosition.x) + "px";
}
box.appendChild(this.ShowContent());
document.body.appendChild(box);
},
hidden:function(){
var obj=document.getElementById("showDiv");
if(!obj)
return;
document.body.removeChild(obj);
},
ShowContent:function(){
var width ="-2px";
var content = document.createElement("DIV");
var contentPadder = document.createElement("DIV");
var msg = document.createElement("DIV");
this._err = "<div style=\"margin-top:15px; height:30px;\">"
+ "<div style=\"float:left;\"><img src=\"text_content-left.gif\" /></div>"
+ "<div style=\"float:left; height:24px;font-size:12px; background:url(text_content-bg.gif); line-height:24px; color:#265972;\">"
+ this._err
+ "</div>"
+ "<div style=\"float:left;\"><img src=\"text_content-right.gif\" /></div>"
+ "</div>"
+ "<div style=\"clear:both;\"></div>"
+ "<div style=\"margin-left:40px; width:80px; margin-top:-9px; position:absolute;\"><img src=\"buttom_angle.gif\" /></div>";
// }
msg.innerHTML = this._err;
with(msg.style){
overflow = "hidden";
}
contentPadder.appendChild(msg);
content.appendChild(contentPadder);
return content;
},
getAbsolutePos:function(el) {
el=document.getElementById(el);
var SL = 0, ST = 0;
if (el.scrollLeft)
SL = el.scrollLeft;
if (el.scrollTop)
ST = el.scrollTop;
var r = { x: el.offsetLeft - SL, y: el.offsetTop - ST };
return r;
}
}
</script>
<p> </p>
<p> </p>
<p>
<input type="text" id="test">
<input type="button" onclick="check()" onblur="checkForm.hidden()" value="检查有效性" />