我想使用单个文本框同时验证电子邮件和手机号码。
我尝试了很多方法,但是没有用。我想验证它是javascript,html5,jquery,angularjs都不是问题。
请帮助我解决这个问题。在此先感谢
http://jsfiddle.net/ANxmv/3582/
<form name="form" ng-app="app" ng-controller="Ctrl" >
<div class="control-group" ng-class="{true: 'error'}[submitted && form.email.$invalid]">
<label class="control-label" for="email">Your email address/Mobile number</label>
<div class="controls">
<input type="email" name="email" ng-model="email" required />
</div>
</div>
<button type="submit" class="btn btn-primary btn-large" ng-click="submitted=true">Submit</button>
</form>
这里是简单的JavaScript代码,可同时验证电子邮件和电话号码。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
function ValidateEmail(mail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
// if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(myForm.emailAddr.value))
if(mail.match(mailformat))
{ alert(mail);
return (true)
}
alert("You have entered an invalid email address!")
return (false)
}
function validate()
{
var data=document.getElementById("email").value;
checkNumberorEmail();
}
function phonenumber(inputtxt)
{
var phoneno = /^\d{10}$/;
if((inputtxt.match(phoneno)))
{
alert(inputtxt);
return true;
}
else
{
alert("enter 10 digit number");
return false;
}
}
function checkNumberorEmail()
{
var data=document.getElementById("email").value;
if (isNaN(data))
{
ValidateEmail(data) ;
}
else{
phonenumber(data)
}
}
</script>
</head>
<body>
<form >
<input type="text" name="email" id="email">
<input type="button" onclick="validate()">
</form>
</body>
</html>
该方法本身不好。但是这里是angular js中可能的简单函数]
HTML
<form name="form" ng-app="app" ng-controller="Ctrl" >
<div class="control-group" ng-class="{invalidClass: 'error'}[submitted && form.email.$invalid]">
<label class="control-label" for="email">Your email address/Mobile number</label>
<div class="controls">
<input type="text" name="email" ng-model="email" required />
</div>
</div>
<button type="submit" class="btn btn-primary btn-large" ng-click="submitForm()">Submit</button></form>
Controller
$scope.submitForm = function(){
if(validateEmail($scope.email) || validateMobile($scope.email)){
// The nput is email or mobile
}
else{
//both are not valid
console.log("Invalid inputs");
$scope.invalidClass = true;
}
}
function validateEmail(email) {
var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(email);
}
function validateMobile(email) {
var re = /^\d{10}$/;
return re.test(email);
}