當增加十（1000,10000,100000等）的功率時，Jquery綁定數字輸入不起作用

Question

我有兩個數字輸入相互綁定，以1000爲單位遞增，一個是上限，一個是下限範圍。每當下範圍設定爲高於上範圍時，上範圍自動更改'值'和'最小'屬性以匹配下範圍值。然而，每當上範圍輸入通過增大下範圍值達到十個閾值（9000,90000等）的功率時，它就停止，而下範圍能夠繼續。有誰知道這是爲什麼，以及如何阻止這種情況發生？

https://jsfiddle.net/tg0ck5r1/

HTML：

<input type="number" id="upperBidRange" step="1000" > 
<input type="number" id="lowerBidRange" step="1000" min="1000" value="1000"> 

JS：

function SetBidIncrementAmountAndUpperBidRangeMins() { 
     $('#upperBidRange').attr('min', $('#lowerBidRange').val()); 
    } 

function SetBidIncrementAmountAndUpperBidRangeValues() { 
    $('#upperBidRange').val($('#lowerBidRange').val()) 
} 

$(SetBidIncrementAmountAndUpperBidRangeMins); 
$(SetBidIncrementAmountAndUpperBidRangeValues); 

$('#lowerBidRange').bind('keyup mouseup onwheel input keypress change paste', function() { 
    SetBidIncrementAmountAndUpperBidRangeMins(); 

    if ($('#lowerBidRange').val() > $('#upperBidRange').val()) { 
    $(SetBidIncrementAmountAndUpperBidRangeValues); 
    } 
}); 

Answer 1

input值總是存儲字符串，因此.val()或this.value總會給你一個字符串。
做if (String > String) {不會給你想要的，因爲你想要的數字

相反，使用parseInt(value, radix)^{MDN Docs}

parseInt($('#lowerBidRange').val() , 10) 

方法如下：

jQuery(function($) { 
 
    // DOM is now ready and $ alias secured 
 

 
    var $upper = $('#upperBidRange'), 
 
     $lower = $('#lowerBidRange'); 
 

 
    function setUpperMin() { 
 
    $upper.attr('min', $lower.val()); 
 
    } 
 

 
    function setUpperVal() { 
 
    $upper.val($lower.val()); 
 
    } 
 

 
    setUpperMin(); 
 
    setUpperVal(); 
 

 
    $lower.on('input', function() { 
 

 
    setUpperMin(); 
 

 
    var lowerVal = parseInt(this.value, 10), 
 
     upperVal = parseInt($upper.val(), 10); 
 

 
    if (lowerVal > upperVal) { 
 
     setUpperVal(); 
 
    } 
 

 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input type="number" id="upperBidRange" step="1000">UPPER 
 
<br> 
 
<input type="number" id="lowerBidRange" step="1000" min="1000" value="1000">LOWER

一個簡單的變體都將使用一元+字符串→數轉換

$lower.on('input', function() { 

    setUpperMin(); 

    if (+this.value > +$upper.val()) { 
     setUpperVal(); 
    } 

    });