使用jQuery和php進行表單驗證

Question

我有一個表單，我正在使用jQuery和php進行驗證。所以基本上，如果PHP的回聲「輸入必須填充」，jQuery應該在該輸入周圍放置一個紅色邊框，但是隻有在提交表單兩次後才能使用。
我解釋：如果我提交輸入填充php文件回聲「輸入必須填寫」，但只有當我再次按下提交按鈕 - 輸入變紅。

$("form#maj_email").submit(function(){ 
var _data = $(this).serialize() 
$.ajax({ 
     type: 'POST', 
     url: 'validation_profil.php?var=maj_email', 
     beforeSend: function(){ 
      $("div#ajax_icon_maj_email").css({background:"url('http://localhost/www3/images/ajax_loader.gif')"}) 
      $("div#error_maj_email").hide() 
      if($("div#error_maj_email").text()=="Email syntaxe incorrecte"){ 
       $("form#maj_email input:[name=email]").css({border:"1px solid red"}) 
      } 

     }, 
     data:_data, 
     cache: false, 
     success: function(html){ 
      $('div#error_maj_email').html(html) 
      $("div#ajax_icon_maj_email").css({background:"url('none')"}) 
      $("div#error_maj_email").fadeIn() 
     } 
    }) 
}) 

Answer 1

它看起來像通過表單提交表單而不是你的ajax調用。你需要防止這種行爲對此有效：

$("form#maj_email").submit(function(e){ 
    var _data= $(this).serialize(); 
    $.ajax({ 
     type: 'POST', 
     url: 'validation_profil.php?var=maj_email', 
     beforeSend: function(){ 
      $("div#ajax_icon_maj_email").css({background:"url('http://localhost/www3/images/ajax_loader.gif')"}) 
      $("div#error_maj_email").hide() 
      if($("div#error_maj_email").text()=="Email syntaxe incorrecte"){ 
       $("form#maj_email input:[name=email]").css({border:"1px solid red"}) 
      } 
     }, 
     data:_data, 
     cache: false, 
     success: function(html){ 
      $('div#error_maj_email').html(html) 
      $("div#ajax_icon_maj_email").css({background:"url('none')"}) 
      $("div#error_maj_email").fadeIn() 

     } 
    }); 
    e.preventDefault(); 
    return false; 
})