доброе время суток у меня есть форма но я мог тока написать валидацию к 1 емайлу , к другим хотел чтоб валидация била базовой html в инпутах проблема заключаетца что я не могу заставить вискакивать картинки при валидации в других инпутах тока в імайле пробивал через масив не пошло
$(document).ready(function() {
$("#validate").keyup(function(){
var email = $("#validate").val();
if(email != 0)
{
if(isValidEmailAddress(email))
{
$("#validEmail").css({
"background-image": "url('validYes.png')"
});
$("#validate").css({
"border": "1px solid black"
});
} else {
$("#validEmail").css({
"background-image": "url('validNo.png')",
});
$("#validate").css({
"border": "3px solid red"
});
}
} 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);
}
<style>
#validEmail
{
margin-top: 4px;
margin-left: 9px;
position: absolute;
width: 16px;
height: 16px;
}
.text
{
font-family: Arial, Tahoma, Helvetica;
}
</style>
<form id="myForm" onsubmit="send_form(); return false;" action="" method="POST">
<p class="mt-3 "> First name </p>
<div class="form-group">
<input type="text" class="form-control " name="first_name" id="first_name" placeholder=" Enter your first name" required min="2" max="30" id="first_name"><span id="validEmai"></span>
</div>
<p class="mt-3 "> Last name </p>
<div class="form-group">
<input type="text" class="form-control " name="last_name" id="last_name" placeholder=" Enter your last name " required min="2" max="30">
</div>
<p class="mt-3 "> Email </p>
<div class="form-group">
<div><input type="text" id="validate" width="30"><span id="validEmail"></span></div>
</div><span id="validEmail"></span>
<p class="mt-3 ">Phone </p>
<div class="form-group">
<input type="number" class="form-control " name="phone" id="phone" placeholder="+ XX (XXX) XXX XX XX " required min="7">
</div>
<p class=" mt-5 border-bottom-main"> Your question </p>
<p class="mt-4 mb-2">Message</p>
<div class="form-group">
<textarea class="form-control" rows="6" name="message" placeholder="Enter your question" id="message" required="" min="4"></textarea>
</div>
<div class="row">
<div class="col-12 col-md-5 col-lg-5 offset-md-7 mt-4">
<button type="submit" class="button button-home" >Submit </button>
</div>
</div>
</form>
