Jquery Only Allow Input Float Number Example

By Hardik Savani November 14, 2020 Category : jQuery

This article will provide some of the most important example jquery only allow input float number. In this article, we will implement a jquery input allow only numbers and decimal. we will help you to give example of allow only numbers and decimal in textbox jquery. Here you will learn allow only float numbers in textbox jquery.

In this example, i will take simple textbox and allow only enter float number. here i also added another example with allow only numbers and 2 decimal in textbox jquery. so let's see both example and i hope it can help you.

Preview:

Example 1: Jquery Only Allow Input Float Number

<!DOCTYPE html>
<html>
<head>
    <title>Jquery Only Allow Input Float Number - ItSolutionStuff.com</title>
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
  
<div class="container">
    <h1>Jquery Only Allow Input Float Number - ItSolutionStuff.com</h1>
    <input type="text" name="number" class="number" autocomplete="off">
</div>
  
</body>
  
<script type="text/javascript">
    $('.number').keypress(function(event) {
      if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57)) {
        event.preventDefault();
      }
    });
</script>
</html>

Example 2: Allow only numbers and 2 decimal in textbox jquery

Read Also: Add/remove multiple input fields dynamically with Jquery Laravel 5.8
<!DOCTYPE html>
<html>
<head>
    <title>Jquery Only Allow Input Float Number - ItSolutionStuff.com</title>
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
  
<div class="container">
    <h1>Jquery Only Allow Input Float Number - ItSolutionStuff.com</h1>
    <input type="text" name="number" class="number" autocomplete="off">
</div>
  
</body>
  
<script type="text/javascript">
    $('.number').keypress(function(event) {
      if ((event.which != 46 || $(this).val().indexOf('.') != -1) &&
        ((event.which < 48 || event.which > 57) &&
          (event.which != 0 && event.which != 8))) {
        event.preventDefault();
      }
  
      var text = $(this).val();
  
      if ((text.indexOf('.') != -1) &&
        (text.substring(text.indexOf('.')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
        event.preventDefault();
      }
    });
</script>
</html>

I hope it can help you...

Tags :
Previous

Laravel Send Mail using Mailgun Example
Next

Jquery - Allow Only Numbers and 2 Decimal in Textbox Example

We are Recommending you

Popular Posts

Categories

Latest Posts

Shares