Javascript最小值和最大值

Question

我使用以下內容來限制文本字段中的值。 僅當用戶嘗試刪除並保留為空白但不允許這樣做時，它才有效。 它不會刪除最小值。 數量：

<input type="text" placeholder="none" name="notepad_and_pen" id="notepad_and_pen" maxlength="10" style="width:50px" tabindex=4 onchange="this.value = (this.value > 999999) ? 999999 : ((this.value < 400) ? 400 : this.value);">

我在標題中也有此腳本，用作空白文本字段的占位符，也許這可能會在某種程度上起作用：

$('input').focus(function(){
    $(this).val('');
}).blur(function(){
    if($(this).val() == "")
    {
        $(this).val($(this).attr('placeholder'))
    }
}
);

請幫忙。 我完全是菜鳥，您可以教的任何東西都很棒。謝謝大家。

Answer 1

this.value的值是一個字符串。 您正在將其與數字進行比較。 在進行比較之前將其轉換為數字，例如：

parseFloat(this.value)

當然，如果您不使用內聯事件處理程序，它將使調試和使用變得更加容易。 您已經在使用jQuery，因此請嘗試以下操作：

$("#notepad_and_pen").on("change", function () {
    var $this = $(this),
        finalValue = $this.val(),
        myValue = parseFloat(finalValue);
    if (isNaN(myValue)) {
        finalValue = "";
    } else {
        if (myValue > 999999) {
            finalValue = 999999;
        } else if (myValue <= 0) {
            finalValue = "";
        } else if (myValue < 400) {
            finalValue = 400;
        }
    }
    $this.val(finalValue);
});

演示： http : //jsfiddle.net/wTKxX/4/

Answer 2

可以#notepad_and_pen對#notepad_and_pen施加限制，並允許刪除。

該頁面提供了一種檢測是否本地支持占位符的方法（從而避免了使用Modernizr）。

並且此頁面提供了一種非本地處理占位符的合理方法。

這是組合的代碼：

$(function() {
    //Impose limits on #notepad_and_pen
    $("#notepad_and_pen").on('change', function() {
        this.value = (this.value === '') ? '' : Math.max(400, Math.min(999999, Number(this.value)));
        //Use the following line to reject anything that's zero, blank or not a number, before applying the range limits.
        //this.value = (!Number(this.value)) ? '' : Math.max(400, Math.min(999999, Number(this.value)));
    });

    //With reference to http://diveintohtml5.info/detect.html
    function supports_input_placeholder() {
      var i = document.createElement('input');
      return 'placeholder' in i;
    }

    //With reference to http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html
    // 1. Handle placeholders (in non-HTML5 compliant browsers).
    if(!supports_input_placeholder()) {
        $('[placeholder]').focus(function () {
            var input = $(this);
            if (input.val() == input.attr('placeholder')) {
                input.val('');
                input.removeClass('placeholder');
            }
        }).blur(function () {
            var input = $(this);
            if (input.val() == '' || input.val() == input.attr('placeholder')) {
                input.addClass('placeholder');
                input.val(input.attr('placeholder'));
            }
        }).blur();

        //2. Prevent placeholder values being submitted to form's action script
        $('[placeholder]').eq(0).closest('form').submit(function () {
            $(this).find('[placeholder]').each(function () {
                var input = $(this);
                if (input.val() == input.attr('placeholder')) {
                    input.val('');
                }
            });
        });
    }
});