複数の名前を検証するjQuery Validateの例を詳しく解説

この記事では主に複数の同じ名前を検証するためのjQuery Validateの方法を紹介しますので、必要な友達は参考にしてください

フォームページには次のコードがあります

 <form>
  <input name="zhai"/><!-- 三个相同name的input -->
  <input name="zhai"/>
  <input name="zhai"/>
 </form>

jquery validateを使用します。複数の名前を検証する 同じ名前を検証する場合、最初の入力ボックスのみが検証されます。

解決策1:

フォームページに対応するjsに次のコードを追加します

 if ($.validator) {
   $.validator.prototype.elements = function () {
    var validator = this,
     rulesCache = {};
    return $(this.currentForm)
    .find("input, select, textarea")
    .not(":submit, :reset, :image, [disabled]")
    .not(this.settings.ignore)
    .filter(function () {
     if (!this.name && validator.settings.debug && window.console) {
      console.error("%o has no name assigned", this);
     }
     rulesCache[this.name] = true;
     return true;
    });
   }
  }

解決策2:

すべてのソースファイルを変更します。ページは複数の名前を検証できます

方法 1: jquery.validate.js ファイルを変更します

Ctrl+F を使用して rulesCache で this.name を見つけますコメント次のコードを削除します。

elements: function() {
   var validator = this,
    rulesCache = {};
   // select all valid inputs inside the form (no submit or reset buttons)
   return $(this.currentForm)
   .find("input, select, textarea")
   .not(":submit, :reset, :image, [disabled]")
   .not( this.settings.ignore )
   .filter(function() {
    if ( !this.name && validator.settings.debug && window.console ) {
     console.error( "%o has no name assigned", this);
    }
    // 注释掉这里
    // select only the first element for each name, and only those with rules specified
    //if ( this.name in rulesCache || !validator.objectLength($(this).rules()) ) {
    // return false;
    //} 
    rulesCache[this.name] = true;
    return true;
   });
  },

方法 2: jquery.validate.min.js ファイルを変更する

ctrl+F を使用して検索 (c[this.name]=!0,!0)})

 return !this.name && b.settings.debug && window.console && console.error("%o has no name assigned", this),
//this.name in c || !b.objectLength(a(this).rules()) ? !1 : (c[this.name] = !0, !0)//注释这行
c[this.name] = !0, !0 //添加这行

【関連する推奨事項】

1.

JavaScript の無料ビデオチュートリアル

2. モバイルマネー形式検証を実装するための 1 行の JS

3. Vue v-model フォーム コントロール バインディングのサンプル チュートリアル

4. ブートストラップ フォーム検証formValidation 例の詳細説明

5. JSのoffsetWidthのバグと処理方法

以上が複数の名前を検証するjQuery Validateの例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。