2013-09-25 82 views
0

我喜歡HTML5約束驗證,因爲它提供了一個定義的和標準的語法來指定應該如何允許輸入以及如何不允許輸入,並防止跨項目的不同實現。如何在舊版瀏覽器中驗證輸入[type =「number」]?

然而,最大的問題是許多人仍然使用舊的瀏覽器,如IE8,因爲許多人仍然使用Windows XP,而IE8是他們自動獲得的最新更新。

如何通過JavaScript驗證此類型的輸入並繼續使用HTML5語法?

+0

https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills#web-forms – Bergi

回答

1

當瀏覽器不支持等瀏覽器不支持的情況下,您可以使用polyfills添加輸入[type =「number」]的支持。

如果你只是想驗證他們,我做了這個功能(它應該支持所有的約束attibutes爲數字),它工作正常,但對我來說你歡迎我點的任何錯誤:

function validateNumbers(){ 
    var returner = true; 
    $(this).find('input[type="number"]').each(function(i){ 
     var valor = $(this).val(); 
     var max = $(this).attr("max"); 
     var min = $(this).attr("min"); 
     var step = $(this).attr("step"); 
     var decimals = 0; 
     if(typeof step == 'undefined'){ 
      step = "1"; 
     } 
     if(typeof valor != 'undefined' && typeof valor.split(".")[1] != 'undefined' && typeof step.split(".")[1] != 'undefined') { 
      decimals = (valor.split(".")[1].length>step.split(".")[1].length)?valor.split(".")[1].length:step.split(".")[1].length; 
     } else if((typeof valor == 'undefined'||typeof valor.split(".")[1] == 'undefined') && typeof step.split(".")[1] != 'undefined'){ 
      decimals = step.split(".")[1].length; 
     } else if((typeof step.split(".")[1] == 'undefined') && typeof valor != 'undefined' && typeof valor.split(".")[1] != 'undefined'){ 
      decimals = valor.split(".")[1].length; 
     } 
     var multiplier = "1"; 
     for (var i=0;i<decimals;i++){ 
      multiplier += "0"; 
     } 
     valor = valor*multiplier; 
     max = max*multiplier; 
     min = min*multiplier; 
     step = step*multiplier; 
     if(isNaN(valor)||(!isNaN(max)&&valor>max)||(!isNaN(min)&&valor<min)||(!isNaN(step)&&(valor-(isNaN(min)?0:min))%step!=0)){ 
      //$(this).parent().addClass("error"); or however you show errors 
      returner = false; 
     } 
    }); 
    return returner; 
} 
相關問題