jquery-validation簡簡單單看一下

jquery-validation

是一個表單驗證的插件,根據不同的屬性,對錶單進行各種的數據驗證

下載

jquery-validation下載

引入

首先得引入jquery的包,其次引入jquery-validation的包

使用

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .error {
      color: red;
    }
  </style>
</head>
<body>

  <form id="myForm" action="xxx">
    <p>用戶名(必須, 最小6位): <input name="username" type="text" required minlength="6"></p>
    <p>密碼(必須,6到8位): <input id="password" name="pwd1" type="password" required minlength="6" maxlength="8"></p>
    <p>確認密碼(與密碼相同): <input name="pwd2" type="password" equalTo="#password"></p>
    <p><input type="submit" value="註冊"></p>
  </form>

<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript">

  /*
  聲明式驗證: 程序員只需要聲明各種驗證規則, 可以自定義驗證錯誤信息
   */

  //對此表單開戶驗證
  $('#myForm').validate({
    messages: {
      username: {
        required: '用戶名是必須的',
        minlength: '用戶名至少爲6位'
      },
      pwd1: {
        required: '密碼是必須的',
        minlength: '密碼至少爲6位',
        maxlength: '密碼最多8位'
      },
      pwd2: {
        equalTo: '必須與密碼相同'
      }
    }
  })
</script>
</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章