输入验证不能超过初始值jQuery

时间:2016-04-29 07:18:58

标签: jquery

我有两个输入字段需要验证,但我在存储其中一个字段的初始值时遇到问题。

例如,第一个字段的值为10,因此输入不能大于10.

我的想法是获得onfocus的值并将其存储在全局var中,但变量不断变化。

验证的两个功能只是检查ammount是否有效

var original_amount;
var original_purchprice;

    $('#order').on({
        focus: function() {
            original_amount = $('.order_amount').val();
            original_purchprice = $('.order_purchprice').val();
        },
        keyup: function() {
            var amount = $('.order_amount').val();
            var purchprice = $('.order_purchprice').val();
            var isValid_amount = true;
            var isValid_purchprice = true;

            if(!isValidAmmount(amount) || (amount > original_amount)){
                 isValid_amount = false;
            }

            if(!roundPositiveNumber(purchprice)){
                isValid_purchprice = false;
            } 

            if(isValid_amount == true && isValid_purchprice == true) {
                $('#save_order').prop('disabled', false);
            } else {
                $('#save_order').prop('disabled', true);
            }
        }
    }, '.order_amount, .order_purchprice');

HTML

<input type='text' class='order_amount' value=10>
<input type='text' class='order_purchprice'value=69.95>

1 个答案:

答案 0 :(得分:1)

您可以使用jQuery data方法(https://api.jquery.com/jquery.data/)存储每个输入的原始值。

然后收听keyup事件,并将输入的当前值与初始值进行比较。

$(document).ready(function() {

    $('.order_amount').each(function(){
        $(this).data('original_amount', $(this).val());
    });

    $('.order_purchprice').each(function(){
        $(this).data('original_purchprice', $(this).val());
    });

    $('#order').on({
        keyup: function() {

           var $current_input = $(this);
           var current_amount = $current_input.val();
           var original_amount = $current_input.data('original_amount');

           // other logic goes here
       }
    }, '.order_amount, .order_purchprice');

});

在这里小提琴:https://jsfiddle.net/c07mc2L1/13/