Казва се "С HTML5 не се нуждаем повече от js или код от страна на сървъра, за да проверим дали въведеният от потребителя'е валиден имейл или url адрес"
Как мога да потвърдя имейл адреса, след като потребителят го въведе? и без JS как да покажа съобщение, ако потребителят въведе грешна форма на имейл адреса си.
<input type="email" pattern="[^ @]*@[^ @]*" placeholder="Enter your email">
<input type="submit" value="Submit">
В HTML5 можете да направите следното:
<form>
<input type="email" placeholder="Enter your email">
<input type="submit" value="Submit">
</form>
И когато потребителят натисне бутона "Изпрати", автоматично се показва съобщение за грешка, като например:
На страницата input type=email
на сайта www.w3.org е отбелязано, че имейл адрес е всеки низ, който отговаря на следния регулярен израз:
/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
Използвайте атрибута required
и атрибута pattern
, за да изисквате стойността да отговаря на regex шаблона.
<input
type="text"
pattern="/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/"
required
>
Много е трудно да се валидира правилно електронната поща само с помощта на атрибута "pattern" на HTML5. Ако не използвате атрибута "pattern", ще бъде обработен someone@, който НЕ е валиден имейл.
Using pattern="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}"
ще изисква форматът да бъде [email protected]
, но ако изпращачът има формат като [email protected]
(или подобен), той няма да бъде валидиран, за да поправите това, можете да поставите pattern="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}"
това ще валидира ".com.au или .net.au или подобни.
Въпреки това, ако използвате това, няма да позволите на [email protected] да валидира. Така че що се отнася до простото използване на HTML5 за валидиране на имейл адреси, то все още не е напълно при нас. За да завършите това, ще използвате нещо подобно:
<form>
<input id="email" type="text" name="email" pattern="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}" required placeholder="Enter you Email">
<br>
<input type="submit" value="Submit The Form">
</form>
или:
<form>
<input id="email" type="text" name="email" pattern="[a-zA-Z]{3,}@[a-zA-Z]{3,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,}" required placeholder="Enter you Email">
<br>
<input type="submit" value="Submit The Form">
</form>
Не знам обаче как да валидирам двете или всички версии на имейл адресите, като използвам атрибута за шаблони на HTML5.