この記事では、Twitterで作成されたBootstrapValidatorを推奨しています。Bootstrap自体はTwitterで作成されているため、元のバリデーターを使用する方が信頼性が高くなります。BaiduからBootstrapValidatorを検索すると、多くのモデルがありますが、これのみをお勧めします（突然、「ライブラリ[Steve Curry]が吹く」感じがします）。
関連するチュートリアルの推奨事項：「ブートストラップチュートリアル」
### 1.
簡単な概要簡単な紹介として、ここに空のチェックがあります。
BootstrapValidatorの公式ダウンロードアドレス
### 2。リソースリファレンス
リソースパッケージをダウンロードすると、次のディレクトリが表示されます。
次に、次の3つのファイルをプロジェクトにインポートします。
1
2
3
###三メンバー名が空ではない。プロジェクト構成
1
2
3
4
5
6
7
8
9
アカウント
<
inputclass = "form-control" type = "text" autofocus = "" name = "username" placeholder = "メンバーシップ番号を入力してください" autocomplete = "off" data-bv-notempty />
data-bv-notemptyは、メンバーシップ番号が空であることを確認する必要があることを意味します。
form-groupのpが必要です。そうでない場合、「再帰が多すぎます」というエラーが報告されます。
validateCallbackメソッドは、フォームが送信されたときに実行されます。このメソッドは、5番目のステップで具体的に導入されます。
### Four。ページが読み込まれた後、ブートストラップバリデーターを有効にします
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$（function（）{ //フォームを検証します $（ "form.required-validate"） .each（function（）{ var $ form = $（this）; $ form.bootstrapValidator（）; //サーバーにバグを繰り返し送信するようにブートストラップバリデーターを修正 $ form.on（ 'success.form.bv'、function （e）{ //フォームの送信を防ぐ
e.preventDefault（）;
}）;
}）;
}）;
' class = "required-validate"'属性をフォームフォームに追加し、jqueryを介して対応するフォームフォームを取得し、デフォルトのbootstrapValidatorでロードします。
上記のコードのコメント部分に注意してください。詳細については、BootstrapValidatorによって送信された繰り返しバグの修正を参照してください。
###五。フォームが送信される検証項目
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
機能validateCallback（フォーム、コールバック、confirmMsg）{ YUNMを。 debug（ "フォームの検証と送信を入力してください"）;
var $ form = $（form）;
var data = $ form.data（ 'bootstrapValidator'）;
if（data）{ //メモリコンポーネントの修復は data.validate（）; if（！data.isValid（））を検証しません{ return false; } } $ .ajax（{ type：form.method || 'POST'、 url：$ form.attr（ "action"）、 data：$ form.serializeArray（）、dataType ： "json"、 cache ：false、 成功：コールバック|| YUNM.ajaxDone、 エラー：YUNM.ajaxError}）; return false;} validateCallbackでフォームフォームを取得した後、isValidメソッドはフォーム検証に合格したかどうかを返すことができます。フォームが検証された後、フォームはajaxを介してサーバーに送信されます。