2013-05-07 64 views
0

http://www.hongkiat.com/blog/ajax-html5-css3-contact-form-tutorial/ 我在我的某個網站上使用了此表單,但他們對此做出的方式對我來說很複雜。我想知道是否有任何方法可以在用戶犯錯時對輸入框進行紅色驗證。像這樣http://jsfiddle.net/3UCbw/1/我只是想突出顯示紅色框,當用戶犯了一個錯誤就是了。感謝任何幫助,將不勝感激!用於錯誤驗證的CSS表單突出顯示

這是我的重點代碼。

div.highlight { 
-webkit-box-shadow:5px 5px 5px black; 
-moz-box-shadow: 5px 5px 5px black; 
box-shadow:5px 5px 5px black; 
-webkit-box-shadow:0 0 15px red; 
-moz-box-shadow: 0 0 15px red; 
box-shadow:0 0 15px red; 
} 

你可以看看頂部鏈接的表格! 也許是在jQuery容易的東西只是爲了突出框謝謝!

+1

題爲 「AJAX PHP的形式使用jQuery」 一個問題應該有一定的AJAX,PHP或jQuery代碼在某處。 – Blazemonger 2013-05-07 19:58:12

+1

該代碼是在網站上的鏈接謝謝。 – xcoderlearnign 2013-05-07 20:00:26

+1

我將標題更改爲更合適的標題 – cwallenpoole 2013-05-07 20:01:11

回答

0
$.fn.extend({ 
    ensure: function(regex, failClass){ 
     return this.each(function(){ 
      if(this.nodeName.toLowerCase() == "input"){ 
       $(this).change(function(){ 
        var $input = $(this); 
        var val = $input.val().toUpperCase();      
        if(regex.test(val)){ 
         $input.removeClass(failClass) 
        } else { 
         $input.addClass(failClass); 
        } 
       }); 
      } 
     }); 
    } 
}); 

var emailRegex = /^[A-Z0-9._%+-][email protected][A-Z0-9.-]+\.[A-Z]{2,4}$/ 
$('#email').ensure(emailRegex, 'error'); 

http://jsfiddle.net/CharlesTWall3/SFV3s/25/