HDTuto.com

Jquery input allow only numbers and decimal



This tutorial will give you example of allow only numbers and decimal in textbox jquery. step by step explain allow only float numbers in textbox jquery. step by step explain jquery allow only float number. you can see jquery only allow input float number.

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 - HDTuto.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 - HDTuto.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

<!DOCTYPE html>

<html>

<head>

<title>Jquery Only Allow Input Float Number - HDTuto.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 - HDTuto.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...




November 14, 2020 | Category : Other



Blog Search