如何解决修剪“输入字段”
我正在尝试创建表单验证功能,并且在 forEach
字段上使用了 input
。
const inputs = document.querySelectorAll("input");
inputs.forEach(function(input){
input.addEventListener("blur",function (){
const inputT = input.value.trim();
if(inputT.validity.valueMissing){
// e_space is the place where errors are displayed
if(e_space){
e_space.textContent = "This field must not be empty.";
input.classList.add("b-r");
}
input.classList.add("input-red");
}else{
e_space.textContent = "";
input.classList.remove("b-r");
}
}
问题(我认为)是我正在处理字段而不是字段的内容,即:input.addEventListener
等,所以我无法修剪它们。
如上例所示,我尝试使用字段 inputT
的内容创建变量 input.value
,对其进行修剪并将其传递给函数。现在我收到一个错误:inputT.validity is undefined
有人可以推荐一种方法来修剪输入字段的值然后运行有效性检查吗?
谢谢。
解决方法
输入元素上存在 .validity
属性,而不是修剪后的字符串。
您需要先将值更新为修剪后的值,然后检查输入字段的有效性。
例如:
input.addEventListener("blur",function (){
input.value = input.value.trim();
if(input.validity.valueMissing){
// ...
,
在这段代码中
const inputT = input.value.trim();
trim 函数返回一个新字符串,而不是 HTML 元素或(输入元素) 所以新字符串没有“有效性”属性。
然后更新此代码:
const inputT = input.value.trim();
if(inputT.validity.valueMissing){...}
这样:
input.value = input.value.trim();
if(input.validity.valueMissing){...}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。