jQuery를 처음 사용하고 전자 메일 주소를 확인하는 데 사용하는 방법이 궁금합니다.
답변
이를 위해 일반적인 오래된 자바 스크립트를 사용할 수 있습니다.
function isEmail(email) {
var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;
return regex.test(email);
}답변
이메일을 검증하는 jQuery 함수
특히 양식에 유효성 검사가 필요한 필드가 하나만있는 경우 플러그인을 사용하고 싶지 않습니다. 이 기능을 사용하여 전자 메일 양식 필드의 유효성을 검사해야 할 때마다 호출합니다.
function validateEmail($email) {
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
return emailReg.test( $email );
}그리고 지금 이것을 사용
if( !validateEmail(emailaddress)) { /* do stuff here */ }건배!
답변
몇 가지 이유로 jQuery 유효성 검사 플러그인 을 사용합니다 .
당신은 확인, 좋아, 지금 무엇? 오류를 표시하고, 유효 할 때 지우기를 처리하고, 총 오류 수를 표시해야합니까? 휠을 다시 발명 할 필요가없는 많은 것들이 당신을 위해 처리 할 수 있습니다.
또한, 또 다른 큰 이점은 그것이 CDN에 호스팅이며, 현재 버전 이 답변의 시간을 여기에서 찾을 수 있습니다 : http://www.asp.net/ajaxLibrary/CDNjQueryValidate16.ashx를 이 수단 빠른로드 시간을 클라이언트에 대한.
답변
에서 봐 HTTP : //bassistance.de/jquery-plugins/jquery-plugin-validation/ . 양식에 대한 강력한 유효성 검사 시스템을 구축 할 수있는 멋진 jQuery 플러그인입니다. 여기에 유용한 샘플이 있습니다 . 따라서 전자 메일 필드 유효성 검사 형식은 다음과 같습니다.
$("#myform").validate({
rules: {
field: {
required: true,
email: true
}
}
});세부 사항 및 샘플 은 이메일 방법 문서 를 참조하십시오 .
답변
<script type="text/javascript">
$(document).ready(function() {
$('.form_error').hide();
$('#submit').click(function(){
var name = $('#name').val();
var email = $('#email').val();
var phone = $('#phone').val();
var message = $('#message').val();
if(name== ''){
$('#name').next().show();
return false;
}
if(email== ''){
$('#email').next().show();
return false;
}
if(IsEmail(email)==false){
$('#invalid_email').show();
return false;
}
if(phone== ''){
$('#phone').next().show();
return false;
}
if(message== ''){
$('#message').next().show();
return false;
}
//ajax call php page
$.post("send.php", $("#contactform").serialize(), function(response) {
$('#contactform').fadeOut('slow',function(){
$('#success').html(response);
$('#success').fadeIn('slow');
});
});
return false;
});
});
function IsEmail(email) {
var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if(!regex.test(email)) {
return false;
}else{
return true;
}
}
</script>
<form action="" method="post" id="contactform">
<table class="contact-table">
<tr>
<td><label for="name">Name :</label></td>
<td class="name"> <input name="name" id="name" type="text" placeholder="Please enter your name" class="contact-input"><span class="form_error">Please enter your name</span></td>
</tr>
<tr>
<td><label for="email">Email :</label></td>
<td class="email"><input name="email" id="email" type="text" placeholder="Please enter your email" class="contact-input"><span class="form_error">Please enter your email</span>
<span class="form_error" id="invalid_email">This email is not valid</span></td>
</tr>
<tr>
<td><label for="phone">Phone :</label></td>
<td class="phone"><input name="phone" id="phone" type="text" placeholder="Please enter your phone" class="contact-input"><span class="form_error">Please enter your phone</span></td>
</tr>
<tr>
<td><label for="message">Message :</label></td>
<td class="message"><textarea name="message" id="message" class="contact-input"></textarea><span class="form_error">Please enter your message</span></td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" class="contactform-buttons" id="submit"value="Send" />
<input type="reset" class="contactform-buttons" id="" value="Clear" />
</td>
</tr>
</table>
</form>
<div id="success" style="color:red;"></div>답변
<!-- Dont forget to include the jQuery library here -->
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#validate").keyup(function(){
var email = $("#validate").val();
if(email != 0)
{
if(isValidEmailAddress(email))
{
$("#validEmail").css({
"background-image": "url('validYes.png')"
});
} else {
$("#validEmail").css({
"background-image": "url('validNo.png')"
});
}
} else {
$("#validEmail").css({
"background-image": "none"
});
}
});
});
function isValidEmailAddress(emailAddress) {
var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
return pattern.test(emailAddress);
}
</script>
<style>
#validEmail
{
margin-top: 4px;
margin-left: 9px;
position: absolute;
width: 16px;
height: 16px;
}
.text
{
font-family: Arial, Tahoma, Helvetica;
}
</style>
<title>Live Email Validation with jQuery Demo</title>
</head>
<body>
<div class="text"><h1>Reynoldsftw.com - Live Email Validation</h1><h2>Type in an email address in the box below:</h2></div>
<div><input type="text" id="validate" width="30"><span id="validEmail"></span></div>
<div class="text"><P>More script and css style출처 : htmldrive.com
답변
Verimail.js를 추천 하고 JQuery 플러그인도있다 .
왜? Verimail은 다음을 지원합니다.
- 구문 유효성 검사 (RFC 822에 따름)
- IANA TLD 검증
- 가장 일반적인 TLD 및 이메일 도메인에 대한 맞춤법 제안
- mailinator.com과 같은 임시 이메일 계정 도메인 거부
따라서 Verimail.js는 유효성 검사 외에도 제안 사항을 제공합니다. 따라서 일반적인 전자 메일 도메인 (hotmail.com, gmail.com 등)과 매우 유사한 잘못된 TLD 또는 도메인이있는 전자 메일을 입력하면이를 감지하여 수정을 제안 할 수 있습니다.
예 :
- test@gnail.con-> test @ gmail.com 을 의미 했습니까 ?
- test@hey.nwt-> test @ hey를 의미 했습니까? 그물 ?
- test@hottmail.com-> test @ hotmail.com 을 의미 했습니까 ?
등등..
jQuery와 함께 사용하려면 사이트에 verimail.jquery.js 를 포함 시키고 아래 함수를 실행하십시오.
$("input#email-address").verimail({
messageElement: "p#status-message"
});메시지 요소는 메시지가 표시 될 요소입니다. 이것은 “이메일이 유효하지 않습니다”에서 “의미 되었습니까?”까지 모든 것이 될 수 있습니다.
양식이 있고 이메일이 유효하지 않으면 제출할 수 없도록 제한하려는 경우 아래에 표시된대로 getVerimailStatus-function을 사용하여 상태를 확인할 수 있습니다.
if($("input#email-address").getVerimailStatus() < 0){
// Invalid
}else{
// Valid
}이 함수는 Comfirm.AlphaMail.Verimail.Status 객체에 따라 정수 상태 코드를 반환합니다. 그러나 일반적으로 0 미만의 코드는 오류를 나타내는 코드입니다.
