jQuery驗證與引導模態插件

Question

有沒有人嘗試通過單擊按鈕以引導模態形式嘗試jquery驗證插件。 我在單擊按鈕時執行以下代碼，但無法正常工作。 任何幫助將不勝感激。 我的代碼也可以在https://jsfiddle.net/dharmjit/unr17s9u/2/

 $('#addForm').validate({ rules: { User_ID: { required: true, minlength: 2, maxlength: 10, messages: { required: "Required input", minlength: jQuery.validator .format("Please, at least {0} characters are necessary"), maxlength: jQuery.validator .format("Please, at least {0} characters are necessary") } }, First_Name: { required: true, minlength: 2, maxlength: 10, messages: { required: "Required input", minlength: jQuery.validator .format("Please, at least {0} characters are necessary"), maxlength: jQuery.validator .format("Please, at least {0} characters are necessary") }, highlight: function(element) { $(element) .closest('.form-group') .removeClass('success') .addClass('error'); }, success: function(element) { element.text('OK!').addClass( 'valid').closest( '.form-group') .removeClass('error') .addClass('success'); } }); 

Answer 1

查看您的jsFiddle ，它與您的OP中的代碼不匹配：

OP ：

• jQuery的： User_ID和First_Name
• HTML：未顯示

jsFiddle ：

• jQuery： firstname和lastname
• HTML： username和password

---

1. 在jsFiddle中，您的規則是根據firstname和lastname聲明的，而您的實際字段則名為username和password 。 字段的name屬性必須與.validate()的rules對象中使用的名稱完全對應。

2. 在JavaScript控制台中，我看到“ .validate不是函數”消息。 請注意jsFiddle的警告消息，如果在添加外部資源時未使用https URL，則它將不起作用。 我將jQuery Validate插件切換為其安全的CDN鏈接 。

3. 您無需同時包含Bootstrap的兩個CSS文件。 縮小版本與未縮小版本具有相同的CSS規則/屬性。 刪除一個。

否則，您發布的代碼將按設計的那樣完全正常工作： https : //jsfiddle.net/unr17s9u/4/