[ JQuery ]

Masked Input Plugin
http://digitalbush.com/projects/masked-input-plugin/
JavaScriptの正規表現について
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Regular_Expressions
- 9999/99/99
- 999a9999a9999
- 999-9999
- (999)9999-****

上記テストのコード 

<style type="text/css">
<!--
  input.test1 {
    font-size:20px;
  }
-->
</style>
 
<link rel="stylesheet" href="./jquery/css/redmond/jquery-ui-1.10.3.custom.css">
<script src="./jquery/js/jquery-1.9.1.js"></script>
<script src="./jquery/js/jquery-ui-1.10.3.custom.js"></script>
<script src="./jquery/js/jquery.maskedinput.js"></script>
 
 
<!-- ===================================================== -->
<script>
 
$(function() {
  $("#input1").mask("9999/99/99",{
    completed:function(){
      if (! chk_seireki( this.val() ) ){
        alert("no seireki");
      }
    }
  });
  $("#input2").mask("999a9999a9999");
  $("#input3").mask("999-9999");
  $("#input4").mask("(999)9999-****");
});
 
 
function chk_seireki(v) {
  r = true;
  if (! /^[12]\d{3}[/]?[01]\d[/]?[0123]\d$/.test( v )) {
    r = false;
  }
 
  return r;
}
 
 
function chk_zipcode(v) {
  r = true;
  if (! /^\d{3}[-]?\d{4}$/.test( v )) {
    r = false;
  }
 
  return r;
}
</script>
 
<!-- ===================================================== -->
<!-- HTML -->
 
<input type="text" class="test1" id="input1"> - 9999/99/99<br>
<input type="text" class="test1" id="input2"> - 999a9999a9999<br>
<input type="text" class="test1" id="input3"> - 999-9999<br>
<input type="text" class="test1" id="input4"> - (999)9999-****<br>


プラスアルファ

　正規表現でチェックする関数と組み合わせるとより、さらに入力した内容をチェックして警告などを表示できる。

r = /[0-9]/.test(v);    ・・・ vに半角数字が1文字でも含まれればrがtrue
r = /^\w{8,}$/.test(v); ・・・ vが8文字以上ならr=true