Demo - jquery-allow-numbers-decimal-textbox-example

Edit This Code :
<html>
<head><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<style>
input {
  float: left;
  width: 100%;
  padding-bottom: 4px;
  padding-top: 4px;
  margin-top: 20px;
  border-radius: 3px;
  border: 1px solid #222;
  padding-left: 5px;
}

</style>
</head>
<body>
<table>
  <tr>
    <td><strong>Int value:</strong></td>
    <td>
      <input type="text" name="numeric" class='allow_numeric'>
      <div>Allow only numeric values (without decimal) </div>
    </td>
  </tr>
  <tr>
    <td> <strong>Decimal :</strong></td>
    <td>
      <input type="text" name="numeric" class='allow_decimal'>
      <div>Allow numeric values with decimal</div>
    </td>
  </tr>
</table>


<script>
$(document).ready(function(){


 $(".allow_numeric").on("input", function(evt) {
   var self = $(this);
   self.val(self.val().replace(/\D/g, ""));
   if ((evt.which < 48 || evt.which > 57)) 
   {
     evt.preventDefault();
   }
 });

 $(".allow_decimal").on("input", function(evt) {
   var self = $(this);
   self.val(self.val().replace(/[^0-9\.]/g, ''));
   if ((evt.which != 46 || self.val().indexOf('.') != -1) && (evt.which < 48 || evt.which > 57)) 
   {
     evt.preventDefault();
   }
 });

});

</script>
</body>
</html>
Result :