jQuery は有効な検証をキャンセルします

フォームを作成するときは、ユーザーが入力したデータを検証する必要があるのは明らかです。 jQuery は、フォーム検証を簡単に実装できる非常に便利なプラグイン jQuery Validate を提供します。しかし、場合によっては、特定のフィールドの検証をキャンセルする必要がある場合もあります。 jQueryを使ってフォームのバリデーションをキャンセルする方法を紹介します。

1. 単一フィールドの検証をキャンセルする

名前と電話番号という 2 つのフィールドを含むフォームがあるとします。電話フィールドの検証をキャンセルしたい場合は、次のコードを使用できます。

$("form").validate({
  rules: {
    name: {
      required: true,
      minlength: 2
    },
    phone: {
      required: true,
      minlength: 11
    }
  },
  messages: {
    name: {
      required: "请输入您的姓名",
      minlength: "姓名长度不能少于2个字符"
    },
    phone: {
      required: "请输入您的电话",
      minlength: "电话长度不能少于11个字符"
    }
  }
});

$("input[name='phone']").rules("remove", "required minlength");

コードでは、まず validate メソッドを通じてフォーム検証を設定します。これには、ルールと合計の値が含まれます。名前と電話のフィールド プロンプト情報。次に、jQuery セレクターで電話フィールドの入力ボックスを選択し、rules メソッドを使用して検証ルールから「required」と「minlength」を削除します。このようにして、電話フィールドを検証する必要がなくなりました。

2. フォーム全体の検証をキャンセルする

場合によっては、フォームを送信する前にフォーム検証を実行するなど、フォーム全体の検証をキャンセルする必要がある場合もあります。ただし、特殊な場合には、検証せずにフォームを直接送信する必要があります。現時点では、次のコードを使用できます。

$("form").validate({
  rules: {
    name: {
      required: true,
      minlength: 2
    },
    phone: {
      required: true,
      minlength: 11
    }
  },
  messages: {
    name: {
      required: "请输入您的姓名",
      minlength: "姓名长度不能少于2个字符"
    },
    phone: {
      required: "请输入您的电话",
      minlength: "电话长度不能少于11个字符"
    }
  }
});

$("form").submit(function(){
  $(this).validate().cancelSubmit = true;
  if($(this).valid()){
    // 表单校验通过，进行表单提交
  }
});

コードでは、最初に validate メソッドを使用してフォーム検証を設定します。フォーム送信イベントでは、 validate() メソッドを呼び出してフォーム検証オブジェクトを取得し、その cancelSubmit 属性を true に設定します。これは、フォームの自動送信動作をキャンセルすることを意味します。次に、もう一度フォーム検証を実行し、合格した場合はフォーム送信操作を実行します。フォームの検証が失敗した場合、フォームは自動的に送信されません。

概要

上記の紹介を通じて、jQuery Validate を使用して単一フィールドの検証とフォーム全体の検証をキャンセルする方法を学びました。これは実際の開発に非常に役立ち、フォーム検証の柔軟性と拡張性を向上させることができます。もちろん、実際のアプリケーションでは、特定のビジネス ニーズに基づいて、特定のフィールドの検証をキャンセルするか、フォーム全体の検証をキャンセルするかを決定する必要があります。

以上がjQuery は有効な検証をキャンセルしますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。