1. 程式人生 > >輸入框數字、百分比、價格 自動驗證 JS

輸入框數字、百分比、價格 自動驗證 JS

自動驗證輸入框並矯正輸入值,將js引入頁面中,並在要新增驗證的輸入框中新增相應class

1、class =‘percentage’ ,驗證是否為百分比,要求輸入0-100範圍內的整數。

$('body').on('keyup blur', '.percentage', function (even) {
             if(even.keyCode>=37&&even.keyCode<=40){
                 return false;
             }
             e = $(this);
             if
(!/^(?:100|[1-9][0-9]?|0)$/.test(e.val())) { e.val(/100|[1-9][0-9]?/.exec(e.val())); if (e.val() == "") { e.val(0); } } });

2、class =‘number’ ,驗證是否為整數。

$('body').on('keyup blur', '.number', function (even) {
             if
(even.keyCode>=37&&even.keyCode<=40){ return false; } e = $(this); if (!/^([1-9]\d*|0)$/.test(e.val())) { e.val(/[1-9]\d*/.exec(e.val())); if (e.val() == "") { e.val(0); } } });

2、class =‘price’ ,驗證是否為價格,保留兩位小數。

$('body').on('keyup blur ', '.price', function (even) {
             if(even.keyCode>=37&&even.keyCode<=40){
                 return false;
             }

             e = $(this);
             var price =e.val();

             if(!/^(([1-9]\d*[.]\d\d?)|([0][.]\d\d?)|([1-9]\d*)|0)$/.test(price)){
                     price= /[1-9]\d*[.]\d\d?/.exec(e.val());
                     price=price?price:/[0][.]\d\d?/.exec(e.val());
                     price=price?price:/[1-9]\d*/.exec(e.val());

                     price=(price=='' || price==null?0:price);

                     price=/^[^.]+[.]$/.test(e.val())?price+".":price;

                     e.val(price);

             }
  });