jquery表单验证> FIREFOX问题

Question

这是一个表单验证，如果输入字段无效，将隐藏提交按钮，并在所有输入字段都有效时显示它。

为什么firefox中的提交按钮在所有输入重新生效之后都保持隐藏状态，而这在其他浏览器中没有发生？

这是有问题的JavaScript：

$(document).ready(function(){ 
$("input[type='text'],input[type='password']").focus(function(){ 
    $(this).siblings('.hideit').removeClass('hideit').parent('div').addClass('phover').siblings('div').removeClass('phover').children('p,strong:not(.invalid,.valid,.hidev)').addClass('hideit'); 
}); 
$("input[type='text'],input[type='password']").blur(function(){ 
    $(this).siblings('p,strong:not(.invalid,.valid,.hidev)').addClass('hideit').parent('div').removeClass('phover'); 
}); 
$("input[type='text'],input[type='password']").change(function(){ 
    var theval = $(this).val(); 
    var theexp = $(this).attr("reg"); 
    var ivalid = new RegExp(theexp); 
    if (theval.search(ivalid) == -1) { 
     $(this).siblings('strong.hidev,strong.valid').removeClass('hidev valid').addClass('invalid').text("x"); 
     showsubmit($(this)); 
     } else { 
      $(this).siblings('strong.hidev,strong.invalid').removeClass('hidev invalid').addClass('valid').text("="); 
      showsubmit($(this)); 
    } 

}); 
function showsubmit(x){ 
    $("input[type='text'],input[type='password']").each(function(){ 
      var getval = $(this).val(); 
      var getreg = $(this).attr("reg"); 
      var itest = new RegExp(getreg); 
      if (getval.search(itest) == -1) { 
       $("p.sub").fadeOut(1000); 
       return false; 
      } else { 
      $("p.sub").fadeIn(1000); 
      return true; 
      } 
    }); 
} 

}); 

<div id="formb"> 
    <form name="tform1" id="form1"> 
     <div ><label for="names">NAMES:</label><strong class="prepend-2 hideit">Your names (Last, First and/or middle).</strong><br /><input type="text" name="name" id="names" reg="^([a-zA-Z]{2,},)((\s[a-zA-Z]{2,})|(\s[a-zA-Z]{2,}){2})$" /><strong class="hidev"></strong><p class="prepend-2 hideit hintf">example: BILL, GATES JOHN</p></div> 
     <div><label for="usern">USERNAME:</label><strong class="prepend-4 hideit">Choose a username.</strong><br /><input type="text" name="user" id="usern" reg="^[a-zA-Z]{6,}$" /><strong class="hidev"></strong><p class="prepend-1 hideit hintf">min 6, without special character or numbers</p></div> 

     <div><label for="userp">PASSWORD:</label><strong class="prepend-4 span-3 hideit">Choose a password.</strong><br /><input type="password" name="pass" id="userp" reg="^(?=.*[0-9]+.*)(?=.*[a-zA-Z]+.*)(?=.*[#@!&]+.*)[0-9a-zA-Z#@!&]{6,}$" /><strong class="hidev"></strong><p class="hintf hideit">min. 6, must contain alphabet(s), number(s) & xter(#, @, &, !)</p></div> 
     <div><label for="email">E-MAIL ADDRESS:</label><strong class="prepend-2 hideit">Input your email address.</strong><br /><input type="text" name="mail" id="email" reg="^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})$" /><strong class="hidev"></strong><p class="prepend-2 hideit hintf">E-mail address must be valid for usage.</p></div> 

      <p class="sub"> 
       <input type="submit" value="Submit" /> 

      </p> 

    </form> 
</div> 

Answer 1

我认为，答案可能在于这样的事实，你是在显示和隐藏您在评估每个输入提交按钮。相反，我立即隐藏了提交按钮，并将“showsubmit”更改为这样。

function showsubmit(x){ 
var hideIt = 0; 
$("input[type='text'],input[type='password']").each(function(){ 
    var getval = $(this).val(); 
    var getreg = $(this).attr("reg"); 
    var itest = new RegExp(getreg); 
    hideIt |= (getval.search(itest) == -1); 
}); 
if (hideIt) { 
    if ($("p.sub").is(":visible")) { 
     $("p.sub").fadeOut(1000); 
    } 
    return false; 
} else { 
    $("p.sub").fadeIn(1000); 
    return true; 
} 
} 

样品可以用JS斌http://jsbin.com/eyexa4/3/edit