Ik wil een if-statement gebruiken om code alleen uit te voeren als de gebruiker een letter of een cijfer typt.

Ik zou kunnen gebruiken

if (event.keyCode == 48 || event.keyCode == 49 || event.keyCode == 50..) {
  // run code
}

Is er een eenvoudigere manier om dit te doen? Misschien werken sommige keycodes niet in alle webbrowsers?

Antwoord 1, autoriteit 100%

Als u een reeks letters wilt controleren, kunt u groter dan en kleiner dan gebruiken:

if (event.keyCode >= 48 && event.keyCode <= 57)
    alert("input was 0-9");
if (event.keyCode >= 65 && event.keyCode <= 90)
    alert("input was a-z");

Gebruik voor een meer dynamische controle een reguliere expressie:

var inp = String.fromCharCode(event.keyCode);
if (/[a-zA-Z0-9-_ ]/.test(inp))
    alert("input was a letter, number, hyphen, underscore or space");

Zie de MDC-documentatievoor de keyCodeeigenschap, wat het verschil verklaart tussen dat en de eigenschap whichen op welke gebeurtenissen ze van toepassing zijn.

Antwoord 2, autoriteit 20%

Gebruik event.keyen moderne JS!

Geen cijfercodesmeer. U kunt keyrechtstreeks controleren.

const key = event.key.toLowerCase();
if (key.length !== 1) {
  return;
}
const isLetter = (key >= "a" && key <= "z");
const isNumber = (key >= "0" && key <= "9");
if (isLetter || isNumber) {
  // Do something
}

U kunt ook een eenvoudige regex gebruiken. ^$zorgt voor 1 teken, inegeert hoofdletters

/^[a-z0-9]$/i.test(event.key)

of individueel:

const isLetter = /^[a-z]$/i.test(event.key)
const isNumber = /^[0-9]$/i.test(event.key)

Antwoord 3, autoriteit 18%

Als u dit doet, zorg er dan eerst voor dat het in de gebeurtenis keypressstaat, de enige gebeurtenis waarvoor u op betrouwbare wijze informatie kunt verkrijgen over het teken dat de gebruiker heeft getypt. Dan zou ik de aanpak gebruiken die Andy E voorstelde:

document.onkeypress = function(evt) {
   evt = evt || window.event;
   var charCode = evt.which || evt.keyCode;
   var charStr = String.fromCharCode(charCode);
   if (/[a-z0-9]/i.test(charStr)) {
       alert("Letter or number typed");
   }
};

Als je op backspace wilt controleren, zou ik in plaats daarvan de gebeurtenis keydowngebruiken en controleren op een keyCodevan 8 omdat verschillende browsers (inclusief Chrome) niet starten een keypress-gebeurtenis voor de backspace-toets.

Antwoord 4, autoriteit 4%

if(event.keyCode >= 48 && event.keyCode <= 90) {
    //the key pressed was alphanumeric
}

Antwoord 5

Zoals @Gibolt al zei,
je moet event.key gebruiken

Omdat charCode, keyCode en Welke worden afgeschaft.

Antwoord 6

Voor numerieke waarden:

function ValidNumeric()
    {
        var charCode = (event.which) ? event.which:event.KeyCode;
        if (charCode>=48 && charCode<=57) 
        {
        return true;
        }
        else
        return false;
    }

Hier is 48 en 57 het bereik van numerieke waarden.

Voor alfabetisch:

function ValidAplpha()
{
    var charCode = (event.which) ? event.which:event.KeyCode;
    if(charCode >= 65 && charCode <= 90 || charCode>=97 && charCode<=122)
    {
    return true;
    }
    else
    return false;
}

Hier is 65 tot 90 het bereik voor Capital alphabates (A-Z) en 97 tot 122 is het bereik voor kleine alphabates (a-z)

Antwoord 7

$('#phone').on('keydown', function(e) {
     let key = e.charCode || e.keyCode || 0;
     //32 = space - border of visible and non visible characters - allows us to backspace and use arrows etc
     //127 - delete
     if (key > 32 && (key < 48 || key > 58) && key !== 127) {
         e.preventDefault();
         return false;
     }
 });

var element = document.getElementById('search');
element.addEventListener('input',function(e){
  console.log(element.value);
});

<input id="search" type="text" placeholder="Search" autocomplete="off">

...onkeypress ="return /[a-z .@ 0-9]/i.test(event.key)" required accesskey="4"

...onkeypress ="return /[a-z ]/i.test(event.key)" required accesskey="4"

...onkeypress ="return /[0-9]/i.test(event.key)" required accesskey="4"

<div class="form-group">
   <input type="Email" class="form-control " id="EMAILADDRESS" name="EMAILADDRESS" placeholder="Email Address"   autocomplete="false" onkeypress ="return /[a-z .@ 0-9]/i.test(event.key)" required accesskey="4"/>  
</div>

$(document).ready(function () {
        $(".TxtPhone").keypress(function (e) {
            var key = e.charCode || e.keyCode || 0;
            // only numbers
            if (key < 48 || key > 58) {
                return false;
            }
        });
});

if (event.charCode > 57 || event.charCode < 48) {
    itsNotANumber();
}
else {
    itsANumber();
}

   function numOnly(evt) {
               evt = evt || window.event;
                var charCode = evt.which || evt.keyCode;
                var charStr = String.fromCharCode(charCode);
                if (/[0-9]/i.test(charStr)) {
                    return true;
                }
                else
                    return false;
            }
    function Alphanum(evt) {
                evt = evt || window.event;
                var charCode = evt.which || evt.keyCode;
                var charStr = String.fromCharCode(charCode);
                if (/[a-z0-9]/i.test(charStr)) {                
                    return true;
                }
                else
                    return false;
            }