请问怎样可以做出这样的效果??? - ASP技术论坛

hmhz

等　级：贵宾
威　望：30
帖　子：1890
专家分：503
注　册：2006-12-17

第 2 楼

得分:0

程序代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML xmlns="http://www. http-equiv="content-type" content="text/html; charset=gb2312" />
<TITLE>输入验证函数</TITLE>
<script language="javascript" type="text/javascript">
function test(obj,strTag){  
var pattern = /.\n/;//正则表答式  
var objstr = obj.id; // INPUT的ID 
var objnext = obj.nextSibling;//INPUT的下一元素（span）
var strValue = obj.value;//INPUT的值 
if(!pattern.test(strValue))//输入所有的值都要到这里来判断  
  {objnext.innerHTML=verifyTextControl(strTag,strValue);  }  
}  



function verifyTextControl(strTag,strValue){
    var strType;
    var intType;
    var strMsgStr;
    var strControl;
    var strControl1;
    var strControl12;
    var strControl2;
    
    if(strTag=="") return true;
    strType=strTag.substring(0,3);
    intType=strTag.substring(4,5);
    strMsgStr=strTag.substring(6);
    strControl1='&nbsp;<img src="http://www. color="red">';
    strControl12='</font>';
    strControl2='&nbsp;<img src="http://www.';
    
    switch(strType){
        //整型
        case "int":                                
            if(intType=="1"){
                if(isNoNull(strValue)==false){
                    strControl=strControl1+strMsgStr+"不能为空！请输入"+strMsgStr+"！"+strControl12;
                    return (strControl);
                }else{
                    if(onlynumber(strValue)==false){
                        strControl=strControl1+strMsgStr+"内应填写数字！"+strControl12;
                        return (strControl);
                   }else{
                     return (strControl2);
                    }
                }

            }else{
                    if((isNoNull(strValue))&&(onlynumber(strValue)==false)){
                        strControl=strControl1+strMsgStr+"内应填写数字！"+strControl12;
                        return (strControl);
                   }else{return (strControl2);}
            }
            break;


        //字符串
        case "str":                                
            if(intType=="1"){
                if(isNoNull(strValue)==false){
                    strControl=strControl1+strMsgStr+"不能为空！请输入"+strMsgStr+"！"+strControl12;
                    return (strControl);
                  }else{return (strControl2);}
                }else{return (strControl2);}
        break;

        <!--这里可以扩展其它验证-->


        //其它
        default:                                
            strControl="函数尚未定义'"+strMsgStr+"'的"+strType+"类别！";
            break;
    }
    return (strControl);
}


function CStr(inp){return(""+inp+"");}


function Trim(str){
    var i,strlength,t,chartemp,returnstr;
    str=CStr(str);
    strlength=str.length;
    t=str;

    for(i=0;i<strlength;i++){
        chartemp=str.substring(i,i+1);
        if(chartemp==" "){t=str.substring(i+1,strlength);}else{break;}
    }
    returnstr=t;
    
    strlength=t.length;
    for(i=strlength;i>=0;i--){
        chartemp=t.substring(i,i-1);
        if(chartemp==" "){
            returnstr=t.substring(i-1,0);
        }
        else{
            break;
        }
    }
    return (returnstr);
}

function isNoNull(str){
    if(Trim(str)==""||Trim(str)==",.") return false;
    return true;
}
  

 function onlynumber(str)   
   {if(!/^\d+$/.test(str))
   {//alert("只能输入数字　");   
       return false;
   };return true;
   }  
</script>
</head>
<style>
.b1,.b2{height : 22px;border:1px solid green}
.b2{height : 22px;border-color:red}
td span {
    color : #00BB01;  /*字体颜色*/
    overflow : hidden;  /*溢出选项—内容会被修剪，但是浏览器不会显示供查看内容的滚动条*/
    text-align : left;  /*水平排列—把文本排列到左边，默认值：由浏览器决定*/
    padding-top : 4px;  /*上内边距*/
    height : 22px;  /*整体高度*/
}
</style>
<body>
<table align="center">
  <tr>
    <td><!-- 输入框 -->
      <INPUT type="text" name="text1" id="text1" value="" class="b1" onFocus="this.className='b2'" onBlur="test(this,'int,1,中国');this.className='b1'"/><span id="validatorText1"> </span> </td>
    <td><!-- 输入框 -->
      <INPUT type="text" name="text2" id="text2" value="" class="b1" onFocus="this.className='b2'" onBlur="test(this,'str,1,美国');this.className='b1'"/><span id="validatorText2"> </span> </td>
    <td><!-- 输入框 -->
      <INPUT type="text" name="text3" id="text3" value="" class="b1" onFocus="this.className='b2'" onBlur="test(this,'int,0,英国');this.className='b1'"/><span id="validatorText3"> </span> </td>
  </tr>
</table>
</body>
</HTML>