时间戳

首页 > 解决方案 > 未捕获的 TypeError：“#login”.validate 不是函数

html - 未捕获的 TypeError：“#login”.validate 不是函数

问题描述

我正在尝试为我的登录表单使用验证插件，但我收到一条错误消息，说“#login validate”不是一个函数。下面我有包含适当库的 HTML 代码和 JS 代码。

<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<link href="recipe.css" rel="stylesheet"/>
<script src="loginval.js"></script>
<body>
<header>
    <center>
    <h1> Login Page</h1>
    <center>
  </header>
   <nav>
     <ul>
     <li>
       <a href="index.html">Home</a>
     </li>
     <li>
        <a href="foodrecipe.html">Food Recipes</a>
     </li>
     <li>
        <a href="add.html">Add Recipe</a>
      </li>
     <li>
       <a href="delete.html">Delete Recipe</a>
     </li>
     <li>
       <a href='login.html'>Login Page</a>
     </li>
     <li>
     <a href="signup.html">Sign Up</a>
     </li>
   </ul>
  </nav>
  <form id="login" align="center">
    <input name="username" placeholder="Username" type="text" > <br>
    <input name="password" placeholder="Password"  type="text"> <br>
    <input class="btn btn-primary" id="submit-button" type="submit" value="Login"> <br>
  </form>

</body>
</html>

上面是我的 HTML，下面是我的 Jquery 代码

$(function() {
   ("#login").validate({
       rules: {
         username: {
           required: true,
           minlength: 5
         },
         password: {
           required: true,
           minlength: 7
         }
       },

       messages: {
         username:  {
           required: "Enter your username",
           minlength: "Username should be minimum 5 characters long"
         },
         password: {
           required: "Enter your password",
           minlength: "Password should be minimum 7 characters long"
         }
       },
   });
});

我为我的注册表单执行了相同的方案，并且没有任何错误。但是由于某种原因，即使我包含了 jquery 验证库，我也遇到了验证错误。

标签： htmljqueryvalidation

解决方案

$(function() {
   $("#login").validate({
       rules: {
         username: {
           required: true,
           minlength: 5
         },
         password: {
           required: true,
           minlength: 7
         }
       },

       messages: {
         username:  {
           required: "Enter your username",
           minlength: "Username should be minimum 5 characters long"
         },
         password: {
           required: "Enter your password",
           minlength: "Password should be minimum 7 characters long"
         }
       },
   });
});

您错过了选择器$前面的符号("#login")。希望对你有帮助...

推荐阅读