根据复选框条件验证输入文本字段（最大值和最小值）

Question

我要做的是根据复选框以及是否选中对输入文本字段应用一些验证。

案例1：勾选复选框时，用户只能输入0到100之间的数字（包括十进制，所以允许34.35）

案例 2：正常数值验证

但是，我的代码在案例 1 中的行为是它只允许用户输入 1 到 9 之间的 1 个数字。

这是我的代码。

HTML 标记

elements.stakeInput = $('<input placeholder="0.00" type="text" style="float:right" />');
elements.promoMoneyCheckbox = $('<input type="checkbox" />');

JS

elements.promoMoneyCheckbox.click(function() {
        SingleDiv.prototype.validatePromoInputField(self);
    });

validatePromoInputField : function(singleDiv) {

        var self = this,
            elements = singleDiv.getElements(),
            promoMoneyCheckbox = elements.promoMoneyCheckbox;

        if (promoMoneyCheckbox.is(':checked')) {

            elements.stakeInput.attr("placeholder", "10.00");
            elements.stakeInput.keypress(function(event) {
                var num = parseInt(self.value, 10),
                    min = 0,
                    max = 100;

                if (isNaN(num)) {
                    this.value = "";
                    return;
                }

                this.value = Math.max(num, min);
                this.value = Math.min(num, max);
            })
        }
        else {
            elements.stakeInput.attr("placeholder", "00.00");
            validateInputs(event, 'decimal')
        }

    }

function validateInputs(event, typeOfInput) {

    event = event || window.event;
    if (event.ctrlKey || event.altKey || event.metaKey) return;

    var regex;
    switch (typeOfInput) {
        case 'decimal':
            regex = /^[.0-9]$/;
            break;
        case 'minAndMax':
            regex = // May be I could add a regex over here instead of the validating in validatePromoInputField fucntion
            break;
        default:
            regex = /^.$/;
            break;
    }

    var char = getKeypressChar(event);
    if (char == null || regex.test(char)) return;

    event.preventDefault ? event.preventDefault() : (event.returnValue = false);

}

有什么简单的方法可以实现吗？

我不是在寻找 HTML5 验证，即（输入类型=“数字”最小值和最大值）。

Answer 1

使用 jquery .change() 事件检测输入的变化，使用parseInt 验证输入。

$("#in").change(function(e) {
    var val = parseInt($(this).val());
    if (!isNaN(val)) {
        if (val >= 0 && val < 100) {
            $("#out").html("good!");
            return;
        }
    }
    $("#out").html("bad!");
});

http://jsfiddle.net/VxM4h/1/

请记住，客户端更改是可以更改的。确保在服务器端也验证您的输入。