Jquery methods "keypress" and "blur" do not work

Navigation
1

Create 2 functions that are validating an input so that only letters are not written, the problem is that I do not know why the code I am putting is not running, here I leave it. 

<!DOCTYPE html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      function soloNumeros(e) {
        var key = window.Event ? e.which : e.keyCode
        return (key >= 48 && key <= 57);
      }

      function soloPegarNumeros(n) {
        permitidos = /[^0-9.]/;
        if (permitidos.test(n.value)) {
          alert("Solo se puede ingresar numeros");
          n.value = "";
          n.focus();
        }
      }

      $("#txtDNI").on("keypress", soloNumeros(event));
      $("#txtDNI").on("blur", soloPegarNumeros(this));
      //$("#txtDNI").keypress(soloNumeros(event));
      //$("#txtDNI").blur(soloPegarNumeros(this));  
    });
  </script>
</head>
<body>
  <input type="text" id="txtDNI" MaxLength="8" />
  <br><br>
  <input type="text" />
</body>
</html>
    
asked by Gian Franco Alexis Poma Vidal 28.12.2018 в 21:19
source

3 answers

2

I think you're complicating a bit, if you're using jQuery you should use the power of this library in your html you have the control id 

<input type="text" id="txtDNI" MaxLength="8" />

simply in the script of your page you put this ... 

$('#txtDNI').on('input', function (event) { 
  this.value = this.value.replace(/[^0-9]/g, '');
});

running here

    
answered by 28.12.2018 / 22:29
source
1

Greetings you could use the following method: 

<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>

    <input type="text" id="txtDNI" MaxLength="8" class="solo_numeros" />
    <br><br>
</body>
<script>
   $(".solo_numeros").keypress (function (event) {
        if ((event.which < 32) || (event.which > 126)) return true; 
        return jQuery.isNumeric ($(this).val () + String.fromCharCode (event.which));
    });
    $('#txtDNI').on("cut copy paste",function(e) {
      e.preventDefault();
   });
</script>
</html>

If you look at the valid lower part that is chosen only numbers based on the class you can do it for what you want id, name, class..etc. I also avoid copying, pasting or cutting in said input based on its id.

You can see it here

I hope you serve

    
answered by 28.12.2018 в 21:57
1

At the precise moment you do soloNumeros(event) you are executing the function soloNumeros which returns a boolean, but the event keypress what you are waiting for is a function. The same happens with the event blur and the method soloPegarNumeros .

Without going so far from the context of the code you have and without making many changes I propose the following code: 

$("#txtDNI").on("keypress", soloNumeros);
$("#txtDNI").on("blur", function() { soloPegarNumeros(this); });

Or you can also wrap the two in a function: 

$("#txtDNI").on("keypress", function(event) { soloNumeros(event); });
$("#txtDNI").on("blur", function() { soloPegarNumeros(this); });
    
answered by 28.12.2018 в 22:34
Datatables jquery ajax error canceled Segmentation fault C ++