Question

我喜欢HTML5约束验证，因为它提供了一个定义的标准语法来指定应该如何允许输入以及它应该如何以及防止跨项目的不同实现。

然而，最大的问题是很多人仍然使用旧的浏览器，例如IE8，因为许多人仍然使用Windows XP，而IE8是他们自动获得的最后一次更新。

如何通过javascript验证此类输入并继续使用HTML5语法？

Answer 1

当浏览器不支持时，您可以使用polyfills添加对输入[type =“number”]的支持，例如Webshims。

如果你只想验证它们，我就做了这个功能（它应该支持数字的所有约束属性），它对我来说很好，但是你可以指出我做的任何错误：

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;
}

如何在旧浏览器中验证输入[type =“number”]？

1 个答案: