简体   繁体   中英

How can i limit the input with javascript or html to letters only, but allow a space to be entered as well?

I need to limit the input allowed in this input element. I've tried using this code, however, this code does not allow someone to enter a space.

<input type="text" id="wisselspelers" onkeypress="return (event.charCode > 64 && 
    event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)">

Only letters should be allowed. Any number or other input (eg <;<.>'" etc.) should not be allowed.

In regards to a user being able to only enter a space, i've created this JS code which forces a user to, at the very least, enter something:

 var input = document.getElementById("wisselspelers").value;
            if (input.trim().length == 0) {

                alert("Een naam is verplicht om op te kunnen slaan!");
                return;
            }
            if (input.trim().length == 1) {
                alert("Een naam kan niet maar 1 letter hebben, vul een naam in!");
                return;
            }

 var input = document.getElementById("wisselspelers").value; if (input.trim().length == 0) { alert("A name is required to save; (en naam is verplicht om op te kunnen slaan.)"). } if (input,trim(),length == 1) { alert("A name cannot have only 1 letter; enter a name! (Een naam kan niet maar 1 letter hebben, vul een naam in!)"); }
 <input type="text" id="wisselspelers" onkeypress="return (event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)">

ASCII for space is 32

Thus, you can use

event.charCode == 32

for the spaces to be accepted.

For making user force to at least add more than 1 characters you can use focusout event

 document.getElementById("wisselspelers").addEventListener("focusout", (event) => { var input = document.getElementById("wisselspelers").value; if (input.trim().length == 0) { alert("A name is required to save; (en naam is verplicht om op te kunnen slaan.)"). } if (input,trim(),length == 1) { alert("A name cannot have only 1 letter; enter a name; (Een naam kan niet maar 1 letter hebben, vul een naam in!)"); } });
 <input type="text" id="wisselspelers" onkeypress="return (event.charCode == 32|| event.charCode > 64 && event.charCode < 91) || (event.charCode > 96 && event.charCode < 123)">

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM