Question

I am trying to create a script that checks the value entered into a numeric form field such that:

• if that value is <= 500, it will show div “A”
• if that value is > 500 and <= 1500, it will show div “B”
• if that value is >= 1501, the user can proceed without interruption.

The basic outline of the code looks something like this:

<input name="income" type="text" id="income" />

<div class="less-than-500" style="display:none;">explanatory text</div>
<div class="less-than-1500" style="display:none;">explanatory text</div>

Answer 1

Something like this should work:

$("#income").change(function(){
    $(".less-than-500,.less-than-1500").hide();
    var myValue = $(this).val();
    if(myValue  <= 500){
       $(".less-than-500").show();
    }
    else if(myValue <= 1500)
    {
        $(".less-than-1500").show();
    }
});

fiddle here: http://jsfiddle.net/VGCKQ/1/

It checks the value when you leave the input field.