最近在使用jquery表單驗證插件時遇到了一個問題,就是無論怎么配置都無法生效,無法進行表單驗證。
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/jquery-validate/1.19.2/jquery.validate.min.js"></script> <form id="myform"> <label for="name">姓名:</label> <input type="text" id="name" name="name"><br><br> <label for="email">郵箱:</label> <input type="text" id="email" name="email"><br><br> <label for="password">密碼:</label> <input type="password" id="password" name="password"><br><br> <button type="submit">提交</button> </form> <script> $(document).ready(function() { $("#myform").validate({ rules: { name: "required", email: { required: true, email: true }, password: { required: true, minlength: 6 } }, messages: { name: "請輸入姓名", email: { required: "請輸入郵箱地址", email: "請輸入有效的郵箱地址" }, password: { required: "請輸入密碼", minlength: "密碼長度不能小于6個字符" } } }); }); </script>
經過一番排查發現,是因為引入的jquery和jquery-validate插件版本不兼容導致的問題。將jquery版本改為1.11.1,問題得以解決。
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/jquery-validate/1.19.2/jquery.validate.min.js"></script>
總結一下,開發中遇到問題不要慌亂,要耐心查找錯誤并找到解決方法。
上一篇jquery表格加超鏈接
下一篇div name id