jquery.validate 使い方

gistfile1.js

//参考サイト：http://d.hatena.ne.jp/sugyan/20090312/1236815025
//          http://d.hatena.ne.jp/kudakurage/20091211/1260521031

//独自バリデーション追加方法
jQuery.validator.addMethod("isKatakana",  function(value,  element) {
  return this.optional(element) || /^([ァ-ヶーｧ-ﾝﾞﾟ]+)$/.test(value);
  }, "カタカナで入力してください"
);

//バリデーション設定方法
$(document).ready(function() {
  $("#myform").validate({
    rules : {
      //<input type="text" size="35" name="name" />
      //<label for="name" class="myError" generated="true" />
      name: {
        required: true,
        maxlength: 50
      },
      //<input type="text" size="35" name="furigana" />
      //<label for="furigana" class="myError" generated="true" />
      furigana: {
        required: true,
        maxlength: 50,
        isKatakana: true
      },
      //<input type="text" name="mail" size="100" value="" />
      //<label for="mail" class="myError" generated="true" />
      mail: {
        required: true,
        email: true,
        maxlength: 100
      }
    },
    //独自メッセージを適用
    messages: {
      name: {
        required: "名前を入力してください",
        maxlength: $.format("名前は{0}文字以下で入力してください")
      },
      furigana: {
        required: "フリガナを入力してください",
        maxlength: $.format("フリガナは{0}文字以下で入力してください"),
      },
      mail: {
        required: "メールアドレスを入力してください",
        maxlength: $.format("メールアドレスは{0}文字以下で入力してください"),
        email: "メールアドレスを正しく入力してください"
      }
    },
    //エラーメッセージ出力クラスの設定
    errorClass: "myError",
    //エラーがあったときの制御
    invalidHandler: function(form,  validator) {
      var errors = validator.numberOfInvalids();
      if (errors) {
        //$('#append_alert').append('<div class="alert"><strong class="miss">入力に誤りがございます。下記、項目における赤字をご確認ください。</strong></div>');
      } else {
        //$('#append_alert').hide();
      }
    }
  });
});