Javascript 得到一个；“this.is不是一个函数”；错误

我正在为我的新网站创建一个“注册”表单，但是jQuery/JS函数有一个问题，该函数应该检查要达到的一些条件

$(function checkform() {
if (this.is("#username")) {
var validchars = /^[a-zA-Z0-9\s]+$/;
var nameHasError;
if (this.val().length < 6 && this.val().length > 26) {
  nameHasError = true;
  this.parent("div").addClass("has-error");
} else if (!(validchars.test(this).val())) {
  nameHasError = true;
  this.parent("div").addClass("has-error");
} else {
  nameHasError = false;
  this.parent("div").removeClass("has-error");
};
} else if (this.is("#password")) {
var passHasError;
if (this.val().length < 5 && this.val().length > 45) {
  passHasError = true;
  this.parent("div").addClass("has-error");
} else {
  passHasError = false;
  this.parent("div").removeClass("has-error");
};
};
});

$（函数检查表单（）{
if（这是（“#用户名”））{
var validchars=/^[a-zA-Z0-9\s]+$/；
var-nameHasError；
if（this.val（）.length<6&&this.val（）.length>26）{
nameHasError=true；
this.parent（“div”）.addClass（“有错误”）；
}否则如果（！（validchars.test（this.val（）））{
nameHasError=true；
this.parent（“div”）.addClass（“有错误”）；
}否则{
nameHasError=false；
this.parent（“div”）.removeClass（“有错误”）；
};
}否则，如果（此.is（“#密码”））{
var传递错误；
if（this.val（）.length<5&&this.val（）.length>45）{
passHasError=true；
this.parent（“div”）.addClass（“有错误”）；
}否则{
passHasError=false；
this.parent（“div”）.removeClass（“有错误”）；
};
};
});

下面是HTML部分（我在我的网站上使用bootstrap，但更喜欢在fiddle上设置一个特定的类）

---

最好的祝愿

您将普通javascript与jquery语法混合在一起

this.is（“#username”）

不是javascript

改用

this.id==“username”

（vanilla js）

或

$（this）.is（“#username”）

（jquery）

注意你的职能中的范围

函数检查表（）{
if（$（this）.is（“#用户名”））{
var validchars=/^[a-zA-Z0-9\s]+$/；
var-nameHasError；
if（$（this.val（）.length<6 | |$（this.val（）.length>26）{
nameHasError=true；
$（this.parent（“div”）.addClass（“有错误”）；
}否则如果（！（validchars.test（$（this.val（）））{
nameHasError=true；
$（this.parent（“div”）.addClass（“有错误”）；
}否则{
nameHasError=false；
$（this.parent（“div”）.removeClass（“有错误”）；
};
}else if（$（this）.is（“#密码”））{
var传递错误；
if（$（this.val（）.length<5 | |$（this.val（）.length>45）{
passHasError=true；
$（this.parent（“div”）.addClass（“有错误”）；
}否则{
passHasError=false；
$（this.parent（“div”）.removeClass（“有错误”）；
};
};
}
$（函数（）{
$（'input'）。在（'keyup'，检查表）上；
})

。有错误{
背景色：红色；
}
.成功了{
背景颜色：绿色；
}

用户名


密码

代码中存在多个问题

• 您已经在

  $（）

  中定义了

  检查表单

  ，因此该函数将仅在dom就绪处理程序中可用，因此您的

  onkeypress

  将抛出错误
• 当dom就绪处理程序调用函数

  时，此

  将是没有

  is

  函数的文档对象
• 字符大小验证应使用

  |

  而不是

  &

因此，最好使用jQuery事件处理程序，使两个字段都有自己的验证函数，如

jQuery（函数（$）{
$（'#username'）。在（'keypress'，function（）上{
var validchars=/^[a-zA-Z0-9\s]+$/；
var nameHasError=false；
变量$this=$（this），
value=this.value；
如果（value.length<6 | | value.length>26）{
nameHasError=true；
}否则如果（！validchars.test（值））{
nameHasError=true；
};
$this.parent（“div”）.toggleClass（“has error”，nameHasError）；
});
$（'#password'）。在（'keypress'，function（）上{
var passHasError=false；
变量$this=$（this），
value=this.value；
如果（value.length<5 | | value.length>45）{
passHasError=true；
};
$this.parent（“div”）.toggleClass（“has error”，passHasError）；
});
});
。有错误{
背景色：红色；
}
.成功了{
背景颜色：绿色；
}

用户名


密码
函数被包装在
$（）
中，这意味着它是在dom就绪状态下执行的。。。因此，
这个
实际上是
文档
在您的代码中
这个
指的是
文档
对象，它没有
is
方法，而且
检查表单
是闭包的本地（dom就绪），所以按一下键会抛出一个类似
（索引）的错误：89未捕获引用错误：未定义checkform
为什么不使用两种不同的方法来验证输入并使用jQuery注册事件句柄我猜
此
问题已经解决，但我的函数仍然存在一个我不理解的问题，因为它是“未定义的”更新的小提琴哪里定义了
a
？下面是我的答案，非常感谢！我对JS/jQuery非常陌生，所以在应用它之前，我将尝试理解整个代码。