Javascript 入力チェック関数　＆＆　簡易フレームワーク

入力チェック系関数

メールの文字文字列、必須チェック、電話番号チェックを用意 チェック関数を作成したらここで登録すれば追加できます

var _checkFunc = {};
// メール文字列チェック
_checkFunc['email'] = function(mailaddr) { //このように関数を作成して登録で関数追加可能
  if (mailaddr == "") {
    return true;//必須チェックは別に実施している前提
  }
  var regs = /^[A-Za-z0-9]{1}[A-Za-z0-9_.-]*@{1}[A-Za-z0-9_.-]{1,}\.[A-Za-z0-9]{1,}$/;
  if (!mailaddr.match(regs)) {
    return false;
  }
  return true;
}
//必須チェック
_checkFunc['mandatory'] = function(instr) {
  if (instr == "") {
    return false;
  }
  return true;
}
//電話番号チェック(携帯・0120あり)
_checkFunc['tel'] = function(telno) {
  if (telno == "") {
    return true;//必須チェックは別に実施している前提
  }
  var reg1 = /^\d{7,11}$/
  var reg2 = /^\d{2,5}-\d{1,4}-\d{3,4}$/
  if (telno.match(reg1)) {return true;}
  if (telno.match(reg2)) {return true;}
  return false;
}

実際のチェック処理ループ

チェック関数を呼び出し、エラーの場合はエラーメッセージを出力 エラー発生部分にフォーカスする処理を実装しています

var check_alls = function(chkid, chkItems, msgid, errmsg) {
  var nchk = chkItems.length;
  //メッセージクリア処理
  if (msgid != "") {
    document.getElementById(msgid).innerHTML = "";
  }
  //チェック呼び出し関数
  for (var j = 0; j < nchk; j++) {
    var inpstr = document.getElementById(chkItems[j]).value;
    if (!_checkFunc[chkid](inpstr)) {
      document.getElementById(chkItems[j]).focus();
      if (msgid != "") {
        document.getElementById(msgid).innerHTML = errmsg;
      }
      return false;
    }
  } // end of for
  //メッセージクリア処理
  if (msgid != "") {
    document.getElementById(msgid).innerHTML = "";
  }
  return true;
}

Copyright(C) SIMPLEONE BLOG.(J.Yamada) 2020- All rights reserved.