Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   проверка email на javascript (https://javascript.ru/forum/events/53128-proverka-email-na-javascript.html)

alerzo 21.01.2015 23:25

проверка email на javascript
 
Здравствуйте, помогите пожалуйста доделать проверку почтового ящика на валидность в моих попытках:)

http://learn.javascript.ru/play/BwqLrc вот тестовая формочка

ruslan_mart 22.01.2015 04:27

100% валидаци сделать не получится, но можно сделать примерную:

Код:

/^.*?@\w+\.\w{2,5}$/.test('user@mail.ru');

alerzo 22.01.2015 08:42

Вопрос остается открытым.

Skipp 22.01.2015 10:12

Вариантов регулярных выражений для валидации электронной почты куча и как написано выше, 100% гарантии нет.

Вот допустим регулярка по стандарту RFC822

var emailRegular = /(?:(?:\r\n)?[ \t])*(?:(?:(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*|(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)*\<(?:(?:\r\n)?[ \t])*(?:@(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*(?:,@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*)*:(?:(?:\r\n)?[ \t])*)?(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*\>(?:(?:\r\n)?[ \t])*)|(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)*:(?:(?:\r\n)?[ \t])*(?:(?:(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*|(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)*\<(?:(?:\r\n)?[ \t])*(?:@(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*(?:,@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*)*:(?:(?:\r\n)?[ \t])*)?(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*\>(?:(?:\r\n)?[ \t])*)(?:,\s*(?:(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*|(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)*\<(?:(?:\r\n)?[ \t])*(?:@(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*(?:,@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*)*:(?:(?:\r\n)?[ \t])*)?(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|"(?:[^\"\r\\]|\\.|(?:(?:\r\n)?[ \t]))*"(?:(?:\r\n)?[ \t])*))*@(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*)(?:\.(?:(?:\r\n)?[ \t])*(?:[^()<>@,;:\\".\[\] \000-\031]+(?:(?:(?:\r\n)?[ \t])+|\Z|(?=[\["()<>@,;:\\".\[\]]))|\[([^\[\]\r\\]|\\.)*\](?:(?:\r\n)?[ \t])*))*\>(?:(?:\r\n)?[ \t])*))*)?;\s*)/;

alert(["info@example.com", emailRegular.test('info@example.com')].join(', '));
alert(["@example.com", emailRegular.test('@example.com')].join(', '));
alert(["info@*9.com", emailRegular.test('info@*9.com')].join(', '));
alert(["admin@ўgg.ru", emailRegular.test('admin@ўgg.ru')].join(', '));
alert(["test@test.test", emailRegular.test('test@test.test')].join(', '));
alert(["первая@почта.рф", emailRegular.test('первая@почта.рф')].join(', '));


Как видно 3 тест, так же прокатывает.

Вот регулярное выражение из спецификации W3C HTML5:

var emailRegular = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/

alert(["info@example.com", emailRegular.test('info@example.com')].join(', '));
alert(["@example.com", emailRegular.test('@example.com')].join(', '));
alert(["info@*9.com", emailRegular.test('info@*9.com')].join(', '));
alert(["admin@ўgg.ru", emailRegular.test('admin@ўgg.ru')].join(', '));
alert(["test@test.test", emailRegular.test('test@test.test')].join(', '));
alert(["первая@почта.рф", emailRegular.test('первая@почта.рф')].join(', '));


Последний тест не проходит.

Проблем с регулярным выражением для электронного адреса много и все их решить не могут, так как многое меняется. Пока решают одну проблему появляется другая.

Ищите в интернете максимально подходящую для вашей аудитории и всё.

ruslan_mart 22.01.2015 10:20

Skipp, видимо не только у меня такой баг.

danik.js 22.01.2015 10:43

Цитата:

Сообщение от alerzo
помогите пожалуйста доделать проверку почтового ящика на валидность в моих попытках

Легко!
<form action="javascript: 'Форма отрпавилась'">

<input type="email" required />
<button type="submit">Попробовать заслать</button>

</form>

losos100 22.01.2015 19:23

если простенький вариант нужен, то можно вот так(для js)

alert(/^[\w-]+@\w+\.\w{2,4}$/.test("foo-bar@bar.com"))
alert(/^[\w-]+@\w+\.\w{2,4}$/.test("foo+bar@bar.com"))

ЗЫ не могу кодом, гребаный сайт глючит ниподеццки, сука.

losos100 22.01.2015 19:25

Цитата:

Сообщение от Ruslan_xDD
.*?

То есть мыла типа **@++)@@foo.ru допустимы?

ruslan_mart 22.01.2015 19:42

losos100, и пусть. Это ведь проблемы пользователя, который ввёл такое мыло. Одно и тоже, что если бы он не своё мыло ввёл. Так что, смысла нет делать какие-то проверки на E-mail.

Вот такого простого варианта вполне хватит:
alert( /^[\w\d%$:.-]+@\w+\.\w{2,5}$/.test('test@mail.ru') );

danik.js 22.01.2015 19:52

Валидация делается в первую очередь ради самого юзера. Чтобы он не ошибся при вводе. Кроме того, нет необходимости следовать всем стандартам. Вот например, vasia@localhost - валидный почтовый ящик, но как мы на него вышлем, допустим регистрационные данные? :D

Vlasenko Fedor 23.01.2015 00:44

Для полноты обзора. Проверка на php :lol:
function validEmail($email = '') {
	$result = false;
    if (strpos($email, '@') !== false) {
		$arr = explode("@", $email);
        $result =  getmxrr($arr[1], $a);
    }
    return $result;
}
 //

var_dump(validEmail('me@mail.ru'));

danik.js 23.01.2015 07:32

Poznakomlus, предложил вариант не в тему, и тот неправильный )
filter_var($email, FILTER_VALIDATE_EMAIL)

Vlasenko Fedor 23.01.2015 11:04

Цитата:

Сообщение от danik.js
Poznakomlus, предложил вариант не в тему, и тот неправильный )

Че? Ты проверяешь строку на основе стандартов.
А мой вариант что делает? Как работает getmxrr
Так и знал, что в диковинку будет :lol:

danik.js 23.01.2015 11:12

Цитата:

Сообщение от Poznakomlus
что в диковинку будет

Знаю я подобную фигню. Использовал недавно dns_get_record для получения DNS_A + DNS_MX + DNS_NS. Просто не заметил в коде.

Существование домена еще не гарантирует существование мыла.
Кроме того, не помню как обстоят дела с субдоменами. getmxrr работает с субдоменами? Да, вроде должно работать..

alerzo 29.01.2015 20:33

Подскажите как сделать чтобы заработала проверка..(
http://learn.javascript.ru/play/FzYrvc

рони 29.01.2015 22:19

alerzo,
может документацию вам почитать
нет у вас document.getElementById('email') ... и т.д.
<!DOCTYPE HTML>
<html>
  <head> <meta charset="utf-8"></head>
  <body>

    <script>
function validate_form() {
    var valid = checkmail();
    if (!document.contact_form.terms.checked) {
        alert("Отметьте галочку внизу формы что Вы не робот и почту ввели верно!");
        valid = false;
    };

    return valid;

    function checkmail() {
        var value = document.getElementById('email').value;
        var reg = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/;
        if (!value.match(reg)) {
            alert("Пожалуйста, введите свой настоящий e-mail");
            document.getElementById('email').value = "";
            return false;
        }
        return true
    }
}
    </script>



    <h3>Свяжитесь со мной</h3>
        Оставьте Ваш e-mail и мы сами Вам напишем в ближайшее время
     <form id="newsletter" action="contact.php" name="contact_form" onsubmit="return validate_form();">
          <div>
            <div class="bg">
              <input class="input" name="email" type="text" required id="email" ><br>
              Я человек и ввел почту верно <input type="checkbox" name="terms" value="Yes">
               </div>
            </div>
            <input class="button" type="submit" value="Жду ответа">
        </form>

</body>

</html>

danik.js 29.01.2015 22:52

Цитата:

Сообщение от рони
required

Я вот думаю: боты наверняка обращают внимание на этот атрибут )
Но это то ладно - поля все равно все подряд заполняются. А вот pattern и type=email|tel|url|number - очень даже в "помощь".
Такой вот недостаток HTML5 валидации :D

alerzo 30.01.2015 08:46

рони, спасибо за помощь!


Часовой пояс GMT +3, время: 02:29.