フォームチェック用JS

作った。といっても質の高いのはたくさん世の中に出てるので、勉強用です。
他のライブラリも画像やCSSも必要ないのが作りたかったんです。

エラー出力先のエレメントを用意しておいて、HTMLの最後にでも、
var v = Validator(document.forms["フォーム名"]);
v.add("inputname", "range", "title", "outputID", "1-32");
v.add("inputname", "halfAlpha", "title", "outputID");
としておいて、フォームタグに、
onsubmit="return v.submit()"
とかしておけば、アラートとエラー出力先にエラーメッセージを出力します。

チェックできるのは、空文字、文字長さ、半角英数字、数字、Eメール、JPGファイルな感じです。

function Validator(formobj) {
  this.formElm = formobj;
  this.checkArr = [];
  this.errMsg = "";
}

Validator.prototype = {
  add: function(formName, type, msgTitle, msgElm, opt) {
    this.checkArr.push([formName, type, msgTitle, msgElm, opt]);
  },

  submit: function() {
    this.errMsg = "";
    for(var i = 0; i < this.checkArr.length; i++) {
      if(this.checkArr[i][1] == "range" || this.checkArr[i][1] == "len" || this.checkArr[i][1] == "equal") {
        this[this.checkArr[i][1]](this.checkArr[i][0], this.checkArr[i][4], this.checkArr[i][2], this.checkArr[i][3]);
      } else {
        this[this.checkArr[i][1]](this.checkArr[i][0], this.checkArr[i][2], this.checkArr[i][3]);
      }
    }
    if(this.errMsg != "") {
      this.errMsg = this.errMsg.replace(/(<BR>|<br>)/g, "\n");
      alert(this.errMsg);
      return false;
    } else {
      return true;
    }
  },

  notEmpty: function(formName, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    if(str == null || str.length == 0) {
      msgObj.innerHTML += msgTitle + " が未入力です<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  number: function(formName, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    var re = /^[0-9]+$/;
    if(!str.match(re)) {
      msgObj.innerHTML += msgTitle + "には、半角数字を入力してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  halfAlpha: function(formName, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    var re = /^[0-9a-zA-Z]+$/;
    if(!str.match(re)) {
      msgObj.innerHTML += msgTitle + "には、半角英数字を入力してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  len: function(formName, num, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    if(str.length != num) {
      msgObj.innerHTML += msgTitle + "は、" + num + "桁ちょうどで入力してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  email: function(formName, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    var re = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;
    if(!str.match(re)) {
      msgObj.innerHTML += msgTitle + "は、メールアドレス形式で入力してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  equal: function(formName, otherForm, msgTitle, msgElm) {
    var pass1 = this.formElm.elements[formName].value;
  　var pass2 = this.formElm.elements[otherForm].value;
    var msgObj = document.getElementById(msgElm);
    if(pass1 != pass2) {
      msgObj.innerHTML += "パスワードと確認用パスワードが一致しません<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  jpg: function(formName, msgTitle, msgElm) {
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    var re = /\.(jpg|JPG)$/i;
    if(!str.match(re)) {
      msgObj.innerHTML += msgTitle + "は、jpgもしくはJPGファイルを指定してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  },

  range: function(formName, range, msgTitle, msgElm) {
    var range = range.split("-");
    var str = this.formElm.elements[formName].value;
    var msgObj = document.getElementById(msgElm);
    if(str.length < range[0] || range[1] < str.length) {
      msgObj.innerHTML += msgTitle + "は、" + range[0] + "〜" + range[1] + "文字で入力してください<br />";
      this.errMsg += msgObj.innerHTML;
    } else {
      msgObj.innerHTML = "";
    }
  }
}

チェック関数呼び出しのところがダサすぎるのがうーん。。。