Fatal编程技术网
  • javascript/
  • Javascript 表单上的Invisibile提交按钮

Javascript 表单上的Invisibile提交按钮

javascript html forms

Javascript 表单上的Invisibile提交按钮,javascript,html,forms,submit,show,Javascript,Html,Forms,Submit,Show,我有一个受验证代码约束的表单。 例如，用户名必须有字母字符。 因此返回true或false function isAlphapet() { var alphaExp = /^[a-zA-Z]+$/; var namee=document.validation.userName.value; var nalt=document.getElementById('name1'); if(namee!="") { if(!namee.match(alphaExp))

我有一个受验证代码约束的表单。 例如，用户名必须有字母字符。 因此返回true或false

function isAlphapet()
{
  var alphaExp = /^[a-zA-Z]+$/;
  var namee=document.validation.userName.value;
  var nalt=document.getElementById('name1');
  if(namee!="")
   {
      if(!namee.match(alphaExp))
      {
       nalt.innerHTML="<font color='red'> Invalid Name: " + document.validation.userName.value + "</font>";
       document.validation.userName.focus();
       document.validation.userName.value="";
       //This will remove the success class if the user tries to modify it incorrectly.
       document.getElementById("userName").className = document.getElementById("userName").className.replace(" validationSuccess", "");
       //This is calling the css class name validationError to color the text box border in red if there is an error.
       //Leaving the replacing attribute empty incase the user hasn't input the correct string.
       document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
         return false;  
       }else{//if it's validated correctly
          nalt.innerHTML="";
         //The text box should be green.
          document.getElementById("userName").className = document.getElementById("userName").className + " validationSuccess";
            return true; 
        }
   }
  else  if(namee.length==0) { //if the user leaves it blank.
   nalt.innerHTML="<font color='red'> Enter Name</font>";
    document.getElementById('name1').focus();
    document.getElementById("userName").className = document.getElementById("userName").className.replace(" validationSuccess", "");
    document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
    //The above is explained on line 27+.
   return false;
    }
}
其中validation是我表单的名称。我试着在头球和身体上使用这个。在这两种情况下，它都无法识别函数的返回值。但是按钮disable和enable只有在/form标记尝试此项后才起作用

              <html>
            <head>
            <script type="text/javascript">
            function isAlphapet()
            {

             var alphaExp = /^[a-zA-Z]+$/;
             var namee=document.getElementById('userName').value;

             var nalt=document.getElementById('name1');
      if(namee!="")
      {
    if(!namee.match(alphaExp))
    {
        alert(namee);       


        nalt.innerHTML="<span style='color:red;'> Invalid Name: " + namee + "</span>";
        document.validation.userName.focus();
        document.validation.userName.value="";
   //This will remove the success class if the user tries to modify it incorrectly.
         document.getElementById("userName").className = document.getElementById("userName").className.replace("             validationSuccess",        "");
   //This is calling the css class name validationError to color the text box border in red if there is an error.
   //Leaving the replacing attribute empty incase the user hasn't input the correct string.
         document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
         return false;  
      }

      else{//if it's validated correctly
      nalt.innerHTML="";
     //The text box should be green.
      document.getElementById("userName").className = document.getElementById("userName").className + " validationSuccess";
        return true; 
      }
  }
    else  if(namee.length==0) { //if the user leaves it blank.
       nalt.innerHTML="<font color='red'> Enter Name</font>";
       document.getElementById('name1').focus();
       document.getElementById("userName").className = document.getElementById("userName").className.replace(" validationSuccess", "");
       document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
//The above is explained on line 27+.
      return false;
    }
 }

            </script>
            </head>
        <body>
         <div style="float:left">
            <form>
                Your Name:<br /><input name="userName" id="userName" onBlur="isAlphapet()" type="text" size="20" maxlength=                    "25" /><br />
            </form>
        </div>
          <div id="name1" style="float:left"></div>
         </body>
        </html> 


函数isAlphapet（）
{
var alphaExp=/^[a-zA-Z]+$/；
var namee=document.getElementById（'userName'）.value；
var nalt=document.getElementById（'name1'）；
如果（名称！=“”）
{
如果（！namee.match（alphaExp））
{
警报（名称）；
nalt.innerHTML=“无效名称：“+namee+”；
document.validation.userName.focus（）；
document.validation.userName.value=“”；
//如果用户试图错误地修改success类，这将删除该类。
document.getElementById（“用户名”）.className=document.getElementById（“用户名”）.className.replace（“validationSuccess”），“”；
//这将调用css类名validationError，以便在出现错误时将文本框边框涂成红色。
//如果用户没有输入正确的字符串，请将替换属性保留为空。
document.getElementById（“用户名”）.className=document.getElementById（“用户名”）.className+“validationError”；
返回false；
}
否则{//如果验证正确
nalt.innerHTML=“”；
//文本框应为绿色。
document.getElementById（“用户名”）.className=document.getElementById（“用户名”）.className+“validationSuccess”；
返回true；
}
}
else if（namee.length==0）{//如果用户将其留空。
nalt.innerHTML=“输入名称”；
document.getElementById（'name1'）.focus（）；
document.getElementById（“用户名”）.className=document.getElementById（“用户名”）.className.replace（“validationSuccess”），“”；
document.getElementById（“用户名”）.className=document.getElementById（“用户名”）.className+“validationError”；
//第27行对上述内容进行了解释。
返回false；
}
}
您的姓名：



if (isAlphapet()== true && emailvalid()== true && browserValid()==true){
    document.validation.sumb.disabled=false;
}
else{
    document.validation.subm.diabled=true;
}

              <html>
            <head>
            <script type="text/javascript">
            function isAlphapet()
            {

             var alphaExp = /^[a-zA-Z]+$/;
             var namee=document.getElementById('userName').value;

             var nalt=document.getElementById('name1');
      if(namee!="")
      {
    if(!namee.match(alphaExp))
    {
        alert(namee);       


        nalt.innerHTML="<span style='color:red;'> Invalid Name: " + namee + "</span>";
        document.validation.userName.focus();
        document.validation.userName.value="";
   //This will remove the success class if the user tries to modify it incorrectly.
         document.getElementById("userName").className = document.getElementById("userName").className.replace("             validationSuccess",        "");
   //This is calling the css class name validationError to color the text box border in red if there is an error.
   //Leaving the replacing attribute empty incase the user hasn't input the correct string.
         document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
         return false;  
      }

      else{//if it's validated correctly
      nalt.innerHTML="";
     //The text box should be green.
      document.getElementById("userName").className = document.getElementById("userName").className + " validationSuccess";
        return true; 
      }
  }
    else  if(namee.length==0) { //if the user leaves it blank.
       nalt.innerHTML="<font color='red'> Enter Name</font>";
       document.getElementById('name1').focus();
       document.getElementById("userName").className = document.getElementById("userName").className.replace(" validationSuccess", "");
       document.getElementById("userName").className = document.getElementById("userName").className + " validationError";
//The above is explained on line 27+.
      return false;
    }
 }

            </script>
            </head>
        <body>
         <div style="float:left">
            <form>
                Your Name:<br /><input name="userName" id="userName" onBlur="isAlphapet()" type="text" size="20" maxlength=                    "25" /><br />
            </form>
        </div>
          <div id="name1" style="float:left"></div>
         </body>
        </html>