[英]Email validation for specific domain not working
我有以下表格
注册.php
<form class="form" action="home.php" method ="POST" enctype="application/x-www-form-urlencoded">
<input type="email" name="email" placeholder="Email Address" id="email"/>
主页.php
<script = "text.javasccript>
$('button').on('click', function(){
str = $('input').val();
str = str.split('@').slice(1);
var allowedDomains = [ 'correct.com' ];
if ($.inArray(str[0], allowedDomains) !== -1) {
alert(str + ' is allowed');
}else{
alert('not allowed');
}
});
</script>
我知道以前有人问过这个问题,但没有实际答案。 我在哪里集成以下功能以与注册表单一起使用
这是新的、经过编辑的代码,但没有人能帮上忙吗?
我唯一的输出消息是即使我输入“允许”域也不允许该域。这是我的代码:
注册.php
<fieldset style = "border-radius:30px;">
<legend>Your Personal Details:</legend>
<form class="form" action="staffhome.php" method ="POST" enctype="application/x-www-form-urlencoded">
<br> <input type="text" name="forename" placeholder ="Forename" id="forename"style = "display:inline; float:left;margin-left:5%;"/>
<input type="text" name="surname" placeholder="Surname" id="surname"style = "display:inline; float:left;margin-left:5%;"/>
<input type="email" name="email" placeholder="Email Address" id="email"style = "display:inline; float:left;margin-left:5%;"/><br /><br><br><br>
<script type = "text/javascript">
$('form').on('submit', function(e){
str = $('input').val();
str = str.split('@').slice(1);
var allowedDomains = [ 'wearecallidus.com' ];
if ($.inArray(str[0], allowedDomains) !== -1) {
alert(str + ' is allowed');
}else{
alert('not allowed');
e.preventDefault();
}
});
</script>
<input type="text" name="phone" placeholder="Phone Number" id="phone"style = "display:inline;margin-right:2.5%"/>
<input type="text" name="ext" placeholder="Extension Number" id="ext"style = "display:inline;margin-left:2.5%;"/><br>
</br>
<hr style="border-top: dotted 1px;" />
<br> <input type="text" name="securityq" placeholder="Security Question" id="securityq" size ="32" maxlength ="60" style = "display:inline;"/>
<input type="text" name="securitya" placeholder="Security Answer" id="securitya" size="32"style = "display:inline;"/><br />
<br><input type="password" name="password" id="password" value="" size="32" placeholder="Type A Password" minlength="6"/><br><br>
<input type="password" name="password-check" id="password-check" value="" size="32" placeholder ="Re-Type Your Password" minlength="6"/><br>
</br>
<input id="button" type="submit" value="Register" disabled="disabled" name="submit">
</fieldset>
无论输入是什么,我每次都得到相同的输出消息,谁能告诉我为什么?
如果我要将 js 放在同一页面中而不是将其外部化,我会这样做:
<!DOCTYPE html>
<html>
<head>
<title>Form example</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function() {
var allowedDomains = [ 'correct.com' ];
$('#myForm').on('submit', function(e) { // when the form is submitted
var str = $('#email').val(),
domain = str.split('@')[1]; // split on @ and take the second part
if ($.inArray(domain, allowedDomains) == -1) {
alert(domain+' not allowed');
e.preventDefault(); // stop form submission
}
});
});
</script>
</head>
<body>
<div id="content">
<form id="myForm" class="form" action="home.php" method ="POST" enctype="application/x-www-form-urlencoded">
<input type="email" name="email" placeholder="Email Address" id="email"/>
<input type="submit" />
</form>
</div>
</body>
</html>
例子
$(function() { var allowedDomains = ['correct.com']; $('#myForm').on('submit', function(e) { var str = $('#email').val(), domain = str.split('@')[1]; if (!domain) domain="An empty domain" $("#emailmsg").html("").hide() if ($.inArray(domain, allowedDomains) == -1) { $("#emailmsg").html(domain + ' not allowed').show(); e.preventDefault(); // stop form submission } }); });
#emailmsg { display:none; color:red }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="content"> <form id="myForm" class="form" action="home.php" method="POST" enctype="application/x-www-form-urlencoded"> <input type="email" name="email" placeholder="Email Address" id="email" /> <span id="emailmsg"></span><br/> <input type="submit" /> </form> </div>
从提交中删除禁用并添加 ID="myForm" 和跨度后使用您的表单:
var allowedDomains = ['correct.com']; function checkEmail(emailId) { var $email=$("#"+emailId); var str = $email.val(),domain = str.split('@')[1]; if (!domain) domain = "Empty domain"; if ($.inArray(domain, allowedDomains) == -1) { $email.attr("placeholder", domain + ' not allowed').addClass("redborder"); } else { $email.attr("placeholder", "Email address").removeClass("redborder"); } } $(function() { $('#myForm').on('submit', function(e) { if (!checkEmail("email")) e.preventDefault(); // stop form submission }); $("#email").on("keyup, blur",function() { checkEmail("email"); } ); });
.redborder { border: 1px solid red }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <fieldset style="border-radius:30px;"> <legend>Your Personal Details:</legend> <form id="myForm" class="form" action="staffhome.php" method="POST" enctype="application/x-www-form-urlencoded"> <br> <input type="text" name="forename" placeholder="Forename" id="forename" style="display:inline; float:left;margin-left:5%;" /> <input type="text" name="surname" placeholder="Surname" id="surname" style="display:inline; float:left;margin-left:5%;" /> <input type="email" name="email" placeholder="Email Address" id="email" style="display:inline; float:left;margin-left:5%;" /> <br> <br> <br> <br> <input type="text" name="phone" placeholder="Phone Number" id="phone" style="display:inline;margin-right:2.5%" /> <input type="text" name="ext" placeholder="Extension Number" id="ext" style="display:inline;margin-left:2.5%;" /> <br> </br> <hr style="border-top: dotted 1px;" /> <br> <input type="text" name="securityq" placeholder="Security Question" id="securityq" size="32" maxlength="60" style="display:inline;" /> <input type="text" name="securitya" placeholder="Security Answer" id="securitya" size="32" style="display:inline;" /> <br /> <br> <input type="password" name="password" id="password" value="" size="32" placeholder="Type A Password" minlength="6" /> <br> <br> <input type="password" name="password-check" id="password-check" value="" size="32" placeholder="Re-Type Your Password" minlength="6" /> <br> </br> <input id="button" type="submit" value="Register" name="mySubmit"> </fieldset>
如果您使用 javascript 进行验证,我建议将脚本与表单放在同一页面中。 另外,既然是 javascript,为什么不动态地做,而不必等待用户提交呢?
$('form').on('submit', function(e){
str = $('input').val();
str = str.split('@').slice(1);
var allowedDomains = [ 'correct.com' ];
if ($.inArray(str[0], allowedDomains) !== -1) {
alert(str + ' is allowed');
}else{
alert('not allowed');
e.preventDefault();
}
});
工作小提琴: https : //jsfiddle.net/j84mqq6k/1/
尝试使用 jQuery。
var email = $("#email").val();
var atpos = email.indexOf("@");
var dotpos = email.lastIndexOf(".");
if (email === null || email === "") {
alert('Please enter email address.!');
$('#email').focus();
} else if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= email.length) {
alert('Please enter valid email address.!');
$('#email').focus();
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.