jquery組み込みバリデーション(validate)使用例(フォームバリデーション)

ホームページ

ウェブフロントエンド

jsチュートリアル

jquery組み込みバリデーション(validate)使用例(フォームバリデーション)_jquery

May 16, 2016 pm 05:10 PM

jquery validate フォームの検証

(1)required:true 必須フィールド
(2)remote:"check.php" ajax メソッドを使用して check.php を呼び出し、入力値を確認します
(3)email:true 正しい形式電子メールの入力が必要です Email
(4)url:true URL を正しい形式で入力する必要があります
(5)date:true 日付を正しい形式で入力する必要があります
(6)dateISO :true 正しい形式 (ISO) で日付を入力する必要があります。例: 2009-06-23、1998/01/22 形式のみが検証され、有効性は検証されません
(7)number:true でなければなりません有効な数字を入力してください (負の数、小数)
(8) 数字: true 必須整数を入力してください
(9)creditcard: 有効なクレジットカード番号を入力する必要があります
(10)equalTo:"#field"入力値は #field
(11)accept: 有効なサフィックスを持つ文字を入力してください文字列 (アップロードされたファイルのサフィックス)
(12)maxlength:5 最大長 5 の文字列を入力してください(漢字は 1 文字として数えます)
(13)minlength:10 最小長 10 の文字列を入力してください (漢字は 1 文字として数えます) 1 文字)
(14)rangelength:[5,10]入力長は 5 ～ 10 の文字列である必要があります) (漢字は 1 文字としてカウントされます)
(15)range:[5,10] 入力値は 5 ～ 10
(16)max の範囲である必要があります:5 入力値は 5
(17)min:10 を超えることはできません入力値は 10

未満であることはできません

インスタンスのデモ:

コードをコピーコードは次のとおりです:

<!DOCTYPE html PUBLIC "-/ /W3C/ /DTD .org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html" / >
 <title>validate.js 組み込み検証ルールの使用</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7. 1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
</ head>
&lt ;body>
<form action="" method="get" id="tinyphp">
<input type="text" value="" name="userName " />
<input type="submit" value="Submit" />
</form>
<script type="text/javascript">
$ ("#tinyphp") .validate({
 // 検証ルールを追加します
 rules: {
 userName:{
 required: true,
 数字: true,
 userName: true ,
 rangelength: [5,10] 
 }
 },

 //プロンプトメッセージをリセット
messages:{
 userName: {
 required: "お願いしますユーザー名を入力してください", 
 数字: "整数を入力してください",
 rangelength: "ユーザー名は 5 ～ 10 文字である必要があります" 
 } }

 }
} ); ;/script>
</body>
</html>