jQueryで正規表現式を利用してメールをチェックするサンプル

2016年1月30日

1.メールの正規表現式
var patterncft = new RegExp(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]+$/);

2.jQuery処理
<script type="text/javascript">
$(document).ready(function() {
$('.error’).hide();
$('.submit’).click(function(event){
var email=$('.email’).val();
if(valid_email(email)) {
$('.error’).hide();
} else {
$('.error’).show();
event.preventDefault();
}
});
});

function valid_email(email) {
var patterncft = new RegExp(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]+$/);
return patterncft.test(email);
}

</script>

3.htmlコード
<form id="register" method="post" action="">
<div>
<span>メールアドレス：</span>
<input type="text" class="email" name="email" />
<span class="error">メールアドレスは間違えます</span>
<input type="submit" value="提出" class="submit" />
</div>
</form>