How to allow numeric (0-9) & decimal value textbox using jQuery?

匿名 (未验证) 提交于 2019-12-03 02:24:01

问题:

i wrote few line to accept only numeric character but my script is not working. when i type any alphabet then it is getting inserted into textbox which i do not want. i want that textbox should accept only numeric value and "." point for decimal. here is my script. just tell me what is wrong there.

 $().ready(function () {         $("input[id*='txtQty']").keyup(function (event) {             var flag = false;              if (event.shiftKey == true) {                 event.preventDefault();             }             // Allow Only: keyboard 0-9, numpad 0-9, backspace, tab, left arrow, right arrow, delete             if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46) {                 // Allow normal operation                 flag = true;             } else {                 // Prevent the rest                 event.preventDefault();             }              if (flag) {              }         });     });

if possible please give me script which will enable my textbox only numeric and decimal number. thanks

here is my full script. the problem is it is taking dot "." which i dont want.

        $().ready(function () {         $("input[id*='txtQty']").keydown(function (event) {             var flag = true;              if (event.shiftKey == true) {                 event.preventDefault();                 flag = false;             }              if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190) {              } else {                 event.preventDefault();                 flag = false;             }              if (flag) {                 if (jQuery.trim(this.value) != "") {                     if (IsNumeric(jQuery.trim(this.value)) == true) {                         var Symbol = $("span[id*='lblPrice']").text().trim().substring(1, 0);                         var oldprice = $("input[id*='txtHiddenPrice']").val();                         var newprice = Math.round((oldprice * this.value), 2);                         $("span[id*='lblPrice']").text(Symbol + newprice);                         UpdateCart($(this).closest('tr').find("input[id*='txtItemId']").val(), $(this).closest('tr').find("input[id*='txtProductId']").val(), this.value);                     }                 }             }         });     });

so tell me what i need to change in my code as a result it should not take decimal value. another important thing i attach keydown() event with wild card system because my page may have many textbox with name end like txtQty.

 $("input[id*='txtQty']").keyup(function (event) {

so please help me. thanks

回答1:

You cant use e.preventDefault() it on the keyup event. Change it to keydown.

Fiddle



回答2:

You could remove the non numeric char when keyup.

The demo.



回答3:

This solution only apply if you didn't include decimal number or only number from 0-9

$("#number").keypress(function( event ){     var key = event.which;      if( ! ( key >= 48 && key <= 57 ) )         event.preventDefault(); });

you can view the running sample here http://jsfiddle.net/yghD3/6/



回答4:

My solution accept Copy&Paste and save the position of the caret. It's used for cost of products so allows positive decimal values only. Can be refactor very easy to allow negative or just integer digits.

$(function () {     $("input.only-positive-decimal").bind("change keyup input", function () {             var position = this.selectionStart - 1;                 //remove all but number and .                 var fixed = this.value.replace(/[^0-9\.]/g, '');                 if (fixed.charAt(0) === '.')                  //can't start with .                     fixed = fixed.slice(1);                  var pos = fixed.indexOf(".") + 1;                 if (pos >= 0)               //avoid more than one .                     fixed = fixed.substr(0, pos) + fixed.slice(pos).replace('.', '');                  if (this.value !== fixed) {                     this.value = fixed;                     this.selectionStart = position;                     this.selectionEnd = position;                 }     }); });

Put on the html page:

<input type="text" class="only-positive-decimal" />


回答5:

You could try http://www.texotela.co.uk/code/jquery/numeric/

This thread mentions the same plugin along with a bunch of other things you could try.



回答6:

//This will let you enter numbers only and the decimal point ones.  $(window).load(function(){ $('.number').keypress(function(event) {   if(event.which < 46 || event.which >= 58 || event.which == 47) {     event.preventDefault();   }    if(event.which == 46 && $(this).val().indexOf('.') != -1) {     this.value = '' ;   }   }); });


回答7:

It will allow only 1 to 9 numbers and decimal. If other characters are being inserted, it will replace those digits.

<script>   $("input[id*='txtQty']").keydown(function () {     var txtQty = $(this).val().replace(/[^0-9\.]/g,'');     $(this).val(txtQty);   }); </script>

Check in fiddle.



回答8:

$('.number').keypress(function(event) {   if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {     event.preventDefault();   } });


回答9:

Try this code

$('#from-amount1').keypress(function(event) { //alert(event.which == 8); //alert(event.which);     if((event.which > 47 && event.which < 58) || (event.which == 46 || event.which == 8))     {     	 // your condition     }     else     {     event.preventDefault();     } }).on('paste', function(event) {     event.preventDefault(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <input type="text" value="" id="from-amount1"/>


回答10:

element.keypress(function (e) {      var charCode = (e.which) ? e.which : event.keyCode;     var dec=0;      dec = (this.value.match(/[.]/g) || [] ).length;      if(dec===1 && e.key=='.')         return false;      if (charCode > 31 && (charCode < 48 || charCode > 57) && charCode!=46)         return false;  });


回答11:

Create a numbers-only class and add it to your element

This will accept:
- backspace
- delete
- numbers
- one decimal

$(".numbers-only").keypress(function (e) {     if(e.which == 46){         if($(this).val().indexOf('.') != -1) {             return false;         }     }      if (e.which != 8 && e.which != 0 && e.which != 46 && (e.which < 48 || e.which > 57)) {         return false;     } });


易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!