2014-09-11 19 views
0

我在JS中的数据验证代码中有一个非常棘手的错误,因为我需要做一个函数来检查页面中的所有HTML用户窗体,因为我必须以输入的数量要检查,如果第一个输入包含一个错误,但代码在第一个输入不包含错误时根本无法正常工作。我检查了循环,如果单独条件,我看不出错误,它会出现,我需要一个新鲜的眼光整个页面的代码是在这里:在JS中的数据验证代码中的棘手的错误

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<style type="text/css"> 
#ballon{ 
border:solid 1px #c0c0c0; 
background-color:yellow; 
font-size:11px; 
font-family:verdana; 
padding:5px; 
position:absolute; 
z-index:2; 
visibility:hidden; 
} 

</style> 
<script language="javascript"> 

var bstatus="off"; 
var Errmsg=""; 

//1)function show error message ballon and used by checkall(x) function below 
function Showmsg(error,Frm){ 
if(!document.getElementById("ballon")){//to check if the ballon div is created or not 
var ballon=document.createElement("div") 
ballon.id="ballon"; 
    document.body.appendChild(ballon); } 
    else{ 
    var ballon=document.getElementById("ballon"); 
    } 

if(bstatus=="on"){//to check if the ballon is visible or not 
ballon.style.top=Frm.offsetTop +"px"; 
ballon.style.left=Frm.offsetLeft+ Frm.offsetWidth + 5 +"px"; 
ballon.innerHTML=error;  
}else{ 
bstatus="on"; 
ballon.style.visibility="visible"; 
ballon.style.top=Frm.offsetTop +"px"; 
ballon.style.left=Frm.offsetLeft+ Frm.offsetWidth + 5 +"px";  ballon.innerHTML=error; 
} 
}//end of function 

//2)hide the error message ballon and used by checkall() function below 
    function Hidemsg(){ 
bstatus="off"; Errmsg=""; 
var ballon=document.getElementById("ballon"); 
ballon.innerHTML=""; 
ballon.style.visibility="hidden"; 

} 

function write(number){//to check where we are in the looping 
var gad=document.getElementById("gad"); 
gad.innerHTML=gad.outerHTML+ number; 
} 

//3) check all function to review if values of the input forms 

    function checkall(x){ 
    for(i=0;i<x;i++){//to loop on all input in form we need to check 
    var Formtype=" "; 
    var Myform=" "; 
    Myform=document.forms[0].elements[i]; 
    Formtype=Myform.getAttribute("title"); 

    switch(Formtype){ 
    case "txt": 
    var value2check=/^[a-zA-Z]+$/; 
    var Errmode="Please enter text only"; break; 
    case "num": 
    var value2check=/^[0-9]+$/; 
    var Errmode="Please enter number only";break; 
    case "both": 
    var value2check=/^[0-9a-zA-Z]+$/; 
    var Errmode="No simples are allowed only alphanumerical values"; break; 
    case "email": 
    var value2check= /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/; 
    var Errmode="Please enter valid Email"; break; 
    case "domain": 
    var value2check= /((?:https?\:\/\/|www\.)(?:[-a-z0-9]+\.)*[-a-z0-9]+.*)/i; 
    var Errmode="Please enter valid URL"; break; 
    default: 
    var value2check=""; 
    }//end of switch 

    if(Myform.value.length!=0 || Myform.value!=""){//to check if the form value is not null 
    if(Myform.value.match(value2check)){ 
     Errmsg=""; Hidemsg(); 
    write(Myform.name+" "+i+" "+bstatus+"<br>");//to test the where we are in the loop 
    }else{ 
    Errmsg=Errmode;  Showmsg(Errmsg,Myform);  break; 
    } //end of inner If condition 
    }else{ 
    Errmsg="Please fill in blank data"; 
Showmsg(Errmsg,Myform); break; 
}//end of if statment 
     }//end of for loop 
    }//end of checkall function 


    </script> 
    </head> 

    <body> 
    <form action="" method="post"> 
    Name of the New table:<input name="tblname" type="text" id="elem" placeholder="Enter tablename" title="txt"><br><br> 
    Number of columns:&nbsp;<input type="text" name="colnumb" placeholder="colnum" title="num" value="" size="3" maxlength="3" lenght="3"><br><br> Table Type:&nbsp;<select name="Tbltype"><option value="MyISAM"selected>MyISAM<option value="InnoDB">InnoDB<option value="CSV">CSV<option value="ARCHIVE">ARCHIVE</select><br><br> 

    <input type="button" name="next" value="Next >>" onclick="checkall(2)"> 

    </form> 
    <div id="gad"></div> 
    </body> 
     </html> 
+0

将尝试在输入有效的txt第一个输入,它在表单中的其余输入上根本不起作用,而如果有非有效的数据,它将按计划运行 – Abogazala 2014-09-11 18:09:02

回答

0

的问题是在Hidemsg,它是欲盖弥彰的“气球”时,它是不是在屏幕上造成的错误,只需添加一个测试,看看运行的代码之前气球存在

function Hidemsg() { 
    bstatus = "off"; 
    Errmsg = ""; 
    var ballon = document.getElementById("ballon"); 
    if(ballon) 
    { 
     ballon.innerHTML = ""; 
     ballon.style.visibility = "hidden"; 
    } 

} 

小提琴http://fiddle.jshell.net/leighking2/5u7oyvqz/

+0

是的,它的工作!,非常感谢您的时间和支持 – Abogazala 2014-09-12 11:30:52

+0

如果这个问题现在关闭您可以标记为答案,干杯 – Quince 2014-09-12 11:56:00