jQuery Validation Plugin

時間 2019-11-12

標籤 jquery validation plugin 欄目 JQuery 简体版

原文原文鏈接

使用方式很簡單，簡單測試代碼以下：javascript

<html>
<head>
    <script type="text/javascript" src="./jquery-1.7.2.js"></script>
    <script type="text/javascript" src="./jquery.validate.1.11.js"></script>
</head>
<body>
<form id="myform">
    <fieldset>

        <input type="text" required="required" name="description" id="description">
        <button type="submit">Check</button>
    </fieldset>
</form>
<script>window.onload = function() {
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
  debug: true,
  success: "valid"
});
$( "#myform" ).validate({
  rules: {
    description: {
      required: true,
      maxlength: 4
    }
  }
});
};</script>
</body>
</html>

若是但願自定義提示信息的位置，使用errorPlacement參數，修改後，代碼以下：html

<html>
<head>
    <script type="text/javascript" src="./jquery-1.7.2.js"></script>
    <script type="text/javascript" src="./jquery.validate.1.11.js"></script>
</head>
<body>
<form id="myform">
    <fieldset>

        <input type="text" required="required" name="description" id="description">
        <button type="submit">Check</button>
    </fieldset>
</form>
<script>window.onload = function() {
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
  debug: true,
  success: "valid"
});
$( "#myform" ).validate({
  errorPlacement: function(error, element) {
        if (element.is(":radio"))
            error.appendTo(element.parent());
        else
            error.insertAfter(element);
    },
  rules: {
    description: {
      required: true,
      maxlength: 4
    }
  }
});
};</script>
</body>
</html>

其中errorPlacement中若是添加了修改，則須要if/else完整語句，因jquery.validation.js源碼中，若是判斷到已設置errorPlacement則按照其配置方式來處理。java

因此，若是僅在errorPlacement中增長的if語句，而沒有對其餘條件（else）處理，則僅當知足if條件時顯示提示信息，其餘沒法顯示提示信息。jquery

showLabel: function(element, message) {
//......
701 if ( this.settings.errorPlacement ) {
702 　　 this.settings.errorPlacement(label, $(element) );
703 } else {
704 　　 label.insertAfter(element);
705 }
//.....
}app

Refs:測試

[1] errorPlacement自定義後其餘不顯示ui

[2] 官網文檔this

http://www.iteye.com/problems/85374spa

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。