简体   繁体   English

如何限制用户在类型为文本的输入字段中输入数字?

[英]How to restrict user from entering number in to an input field with type as text?

How to disable the user from entering a number in to input field.如何禁止用户在输入字段中输入数字。 When we use type as number we are restricted from entering text in to the input.The same way how to achieve the vice versa.当我们使用类型作为数字时,我们被限制在输入中输入文本。同样的方式如何实现反之亦然。 Someone help i need this to complete my assignment.有人帮助我需要这个来完成我的任务。

<input type="text" name="name" />

You can listen to keydown , and if the key pressed is a number, just call event.preventDefault() on the keyboard event.您可以收听keydown ,如果按下的键是数字,只需在键盘事件上调用event.preventDefault()即可。

 const input = document.querySelector('input'); input.addEventListener('keydown', function(event){ if((/\d/g).test(event.key)) event.preventDefault(); })
 <input type="text" />

You can add an input event listener to the input which gets the input's value, replaces every numeric character (with String.replace ), then assigns the result back to the input's value:您可以将input事件侦听器添加到获取输入值的输入,替换每个数字字符(使用String.replace ),然后将结果分配回输入值:

 const input = document.querySelector('input'); input.addEventListener('input', function(){ this.value = this.value.replace(/[^\D]/g,'') })
 <input type="text" name="name" />

You can use 1 line function to prevent any number in the input with help of regular expression您可以使用 1 行 function 在正则表达式的帮助下防止input中的任何数字

But it is not recommended to use inline function, here is provided only to tell about a different approach但是不推荐使用inline function,这里提供只是说一下不同的做法

See here to know more about regular expression 请参阅此处以了解有关正则表达式的更多信息

 <input type="text" name="name" oninput=" this.value = this.value.replace(/[0-9]/g,'')" />

Try to use pattern with regex:尝试将pattern与正则表达式一起使用:

 <input type="text" name="name" pattern="\D" />

\D will reject all digits \D将拒绝所有数字

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何限制在输入类型号中输入十进制值? - How to restrict from entering a decimal value in input type number? 我如何限制在 React JS 的输入类型数字字段中输入多个点? - How can i restrict entering more than one dots in input type number field in react js? 限制用户在Android上的输入字段中输入句点 - Restrict the user entering period in input field on Android 防止用户在数字类型的输入元素中输入负数 - Preventing user from entering negative numbers in input elements with number type 如何动态限制重复值<input='text' />在一个循环的随机值中<input='number' />场地 - How to dynamically Restrict Duplicated value of <input='text'/> in a looped random value from <input='number'/> field Javascript 正则表达式限制用户在文本字段中输入相同的连续数字 - Javascript Regular Expression to restrict user from Entering same consecutive digits in a text field 如何防止用户在输入字段中输入字符“`”? - How to prevent the user from entering the character "`" in the Input field? 如何防止用户在 ReactJS 的输入表单字段中输入空格? - How to prevent user from entering spaces in an input form field in ReactJS? 如何防止用户在Vue 3数字输入中输入低于1的值 - How to prevent user from entering value below 1 in Vue 3 number input 在 cellEditable 材质表上,如何限制用户输入负数? - On an cellEditable material-table, how to restrict the user from entering negative number?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM