檢查輸入文本字段中的JSON數組值

Question

問題：

我有一個部分起作用的函數，由於某種原因它卡在值100中。所有其他值都可以正常工作。 該函數將輸入字段的值與JSON數組中的對應值進行比較。

場景：

例如，您選擇3，然后選擇1，然后選擇1，最終將得到值12。如果在輸入字段中輸入100，然后繼續前進，則會顯示錯誤，如addClass（）所示。 100不小於12，並且不應允許addClass（）添加錯誤。 錯誤在哪里？

HTML代碼：

<div id="ref" class="control-group">
    <label class="control-label">Number of references:</label>

    <div class="controls">
        <div class="input-prepend">
            <input class="input-small" id="references" name="references" type="text">
        </div>
    </div>
</div>

該數組由PHP生成，並根據以下內容通過json_encode（）轉換為JavaScript：

var numbers = <?php echo json_encode($numbers); ?>;

數組：

{
    "1":{
        "1":{
            "1":"36",
            "2":"63"
        },
        "2":{
            "1":"54",
            "2":"63"
        }
    },
    "2":{
        "1":{
            "1":"60",
            "2":"105"
        },
        "2":{
            "1":"90",
            "2":"105"
        }
    },
    "3":{
        "1":{
            "1":"12",
            "2":"21"
        },
        "2":{
            "1":"18",
            "2":"24"
        }
    }
}

jQuery代碼：

<script type="text/javascript">
    $(document).ready(function()
    {           
        $('#references').change(function() 
        {
            var choice1 = $('input[name=level]:checked').val();

            if (choice1 == '1') 
            {
                var choice2 = $('input[name=authors]:checked').val();
            } 
            else 
            {
                var choice2 = $('input[name=credits]:checked').val();
            }

            var number = numbers[3][choice1][choice2];

            if ($(this).val() < number) 
            {
                $('#ref').addClass('error');
            } 
            else 
            {
                $('#ref').removeClass('error');
            }
        });
    });
</script>

Answer 1

您正在此處進行字符串比較。 在字符串比較中"100" < "12" = true 。 嘗試如下進行數字比較，

if (parseInt($(this).val(), 10) < parseInt(number, 10))

Answer 2

現在，您所有的數字都是字符串...因此javascript引擎不會將您的數字視為真實數字。

嘗試將parseInt（）包裹在您希望是數字的任何東西周圍：

<script type="text/javascript">
    $(document).ready(function()
    {           
        $('#references').change(function() 
        {
            var choice1 = $('input[name=level]:checked').val();

            if (choice1 == '1') 
            {
                var choice2 = $('input[name=authors]:checked').val();
            } 
            else 
            {
                var choice2 = $('input[name=credits]:checked').val();
            }

            var number = parseInt( numbers[3][choice1][choice2], 10);

            if (parseInt( $(this).val(), 10) < number) 
            {
                $('#ref').addClass('error');
            } 
            else 
            {
                $('#ref').removeClass('error');
            }
        });
    });
</script>