使用JSON数组检查输入文本字段中的值

时间:2012-06-01 15:38:20

标签: php javascript jquery arrays json

问题:

我有一个部分工作的功能,并且由于某种原因它会卡在值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>

2 个答案:

答案 0 :(得分:5)

你正在进行字符串比较。在字符串比较"100" < "12" = true中。尝试进行如下的数字比较,

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

答案 1 :(得分:1)

现在,你的所有数字都是字符串......所以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>