Question

我想定义一个使用java脚本验证范围的函数我有两个文本框，我输入最大值和最小值。这是我的代码：

 <tr id="TR_Max">
  <td><span>max value:</span></td>
  <td><input id="Text2" type="text" style="width:90%"/></td>
 </tr>
 <tr id="TR_Min">
  <td><span>min value:</span></td>
  <td><input id="Text3" type="text" style="width:90%"/></td>
 </tr>

我有另一个文本框，用户输入他们的愿望值。

<input id="user_val" type="text" style="width:90%"/>

现在我需要一个检查用户值的函数，无论是在max和min之间还是no。当然第一个我应该检查max和min值的类型。我怎么能这样做？

Answer 1

我认为处理这个问题的最好方法是创建一个可以依次评估的正则表达式列表。如果你找到一个匹配然后你知道你的类型，如果你没有找到匹配，那么你可以认为它只是一种刺痛类型。

正则表达式列表可以与数组中的数据类型配对，如下所示：

var patterns = [
    [
        'int', /^[\d]+$/],
    [
        'float', /^[-+]?[0-9]*\.?[0-9]+$/],
    [
        'date', /^(0[1-9]|[12][0-9]|3[01])[- \/.](0[1-9]|1[012])[- \/.](19|20)\d\d$/]
];

注意：日期格式必须为dd/mm/yyyy，但可以根据需要进行更改

然后假设html有几个字段（#min和#max），我们可以创建这个函数（注意使用JQuery）：

function compare() {
    var min = $("#min").val();
    var max = $("#max").val();

    if (min === "" || max === "") {
        alert("data missing - check down the sofa");
        return;
    }

    var dataType = "string";

    for (var i = 0; i < patterns.length; i++) {
        if (patterns[i][1].test(min) && patterns[i][2].test(max)) {
            dataType = patterns[i][0];
            break;
        }
    }

    alert("Min and Max are of type: " + dataType);
}

请注意，两个字段必须具有相同的数据类型，否则会导致string数据类型。

Here is a working example

如果您想扩展它以验证范围，您可以这样做：

function checkRange(dataType, min, max) {
    var minValue, maxValue;

    switch (dataType) {
        case 'int':
            {
                minValue = parseInt(min, 10);
                maxValue = parseInt(max, 10);
            }
            break;
        case 'float':
            {
                minValue = parseFloat(min);
                maxValue = parseFloat(max);
            }
            break;
        case 'date':
            {
                minValue = $.datepicker.parseDate('dd/mm/yy', min);
                maxValue = $.datepicker.parseDate('dd/mm/yy', max);
            }
            break;
        case 'string':
            {
                minValue = min;
                maxValue = max;
            }
            break;
    }

    return minValue <= maxValue;
}

Here is a working example（注意：JQuery UI用于解析日期）

如何使用javascript创建范围验证器？不要在VS中使用范围验证器控件

1 个答案: