Подтверждение введенного адреса электронной почты и пароля в JavaScript - PullRequest
2 голосов
/ 25 ноября 2011

Я хочу создать в JavaScript функцию, которая будет проверять введенную электронную почту и пароль, которая проверяет введенную электронную почту, чтобы убедиться, что она содержит не менее 2-3 символов после последнего периода в строке (для .com, .org, .ca и т. д.) и что в строке есть хотя бы один символ '@'.

Что касается проверки пароля, я хочу, чтобы функция проверяла, чтобы она имела как минимум одну строчную и одну заглавную букву, хотя бы одно число и хотя бы один специальный символ (!, @, #, $,%, ^, &, *, ~)

Кто-нибудь знает, что мне нужно сделать, чтобы получить регулярное выражение для проверки пароля как минимум на 1 специальный символ, такой как!, @, * И т. Д.?

Вот что у меня есть:

function validatePassword(password)
{
    var passwordPattern = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/;
return passwordPattern.test(password)
}

// Validate form
function validate()
{
var email = user.email.value;
if(validateEmail(user.email.value))
    user.validEmail.value = "OK";
else
    user.validEmail.value = "X";
if(validatePassword(user.password.value))
    user.validPassword.text = "OK";
else
    user.validPassword.text = "X";
}

Ответы [ 3 ]

2 голосов
/ 25 ноября 2011

Вы можете использовать регулярные выражения для обоих случаев.Что касается электронной почты, вы можете прочитать больше здесь: http://www.zparacha.com/validate-email-address-using-javascript-regular-expression/ Что касается проверки пароля, я бы рекомендовал прочитать это: http://www.the -art-of-web.com / javascript / validate-password /

Вот проверка пароля:

<input type="password" id="txtPassword" onblur="validate"/>
<script type="text/javascript" src="../jQuery/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
    var txtPassword = null;

    var txtPassword_Blur = function(e) {
        var exp = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/;
        var validPassword = exp.test($(this).val());
        if(validPassword) {
           alert('valid');
        } else {
           alert('not valid');
        }
    };

    $(function() {
        txtPassword = $("#txtPassword");
        txtPassword.bind("blur", null, txtPassword_Blur);
    });
</script>

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

1 голос
/ 04 августа 2015

Посмотрите мой проект кросс-браузерного фильтра значения элемента ввода текста на вашей веб-странице с использованием языка JavaScript: Фильтр ключа ввода .Вы можете отфильтровать значение в виде целого числа, числа с плавающей запятой или написать собственный фильтр, например фильтр телефонных номеров.Смотрите пример кода ввода электронного адреса и пароля:

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Input Key Filter Test</title>
	<meta name="author" content="Andrej Hristoliubov anhr@mail.ru">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	
	<!-- For compatibility of IE browser with audio element in the beep() function.
	https://www.modern.ie/en-us/performance/how-to-use-x-ua-compatible -->
	<meta http-equiv="X-UA-Compatible" content="IE=9"/>
	
	<link rel="stylesheet" href="https://rawgit.com/anhr/InputKeyFilter/master/InputKeyFilter.css" type="text/css">		
	<script type="text/javascript" src="https://rawgit.com/anhr/InputKeyFilter/master/Common.js"></script>
	<script type="text/javascript" src="https://rawgit.com/anhr/InputKeyFilter/master/InputKeyFilter.js"></script>
	
</head>
<body>
Email: <input type="email" id="Email" value="username@domain.com"/>
<script>
	CreateEmailFilter("Email", function(event){//onChange event
			inputKeyFilter.RemoveMyTooltip();
			var elementNewInteger = document.getElementById("NewEmail");
			elementNewInteger.innerHTML = this.value;
		}
		
		//onblur event. Use this function if you want set focus to the input element again if input value is NaN. (empty or invalid)
		, function(event){ this.ikf.customFilter(this); }
	);
</script>
 New email: <span id="NewEmail"></span>
<hr>
Password: 
<input type="password" id="Password"
	onchange="javascript: onChangePassword(this)"
	onblur="javascript: this.ikf.customFilter(this)"
/>
<script>
	function onChangePassword(input){
		inputKeyFilter.RemoveMyTooltip();
		if(!input.ikf.customFilter(input))
			return false;
		var elementNewPassword = document.getElementById("NewPassword");
		elementNewPassword.innerHTML = input.value;
	}
	CreatePasswordFilter("Password"
		, function(elementInput, value){//customFilter
//consoleLog("password customFilter. elementInput = " + elementInput + "\n\n" + printStackTrace().join("nn"));

				if(typeof value == 'undefined')
					value = elementInput.value;
					
				var array = value.match(/([^a-zA-Z\d]+)/);
				if(array != null){
					inputKeyFilter.TextAdd(isRussian() ?
							"Недопустимый символ: " + array[0]
							: "Invalid symbol: " + array[0]
						, elementInput, "uparrowdivred");
					inputKeyFilter.focus(elementInput);
					return false;
				}
				var passwordLengthMin = 6;
				if(value.length < passwordLengthMin){
					inputKeyFilter.TextAdd(isRussian() ?
							"Пароль должен быть длиннее " + passwordLengthMin + " символов."
							: "The password at least " + passwordLengthMin + " characters."
						, elementInput);
					inputKeyFilter.focus(elementInput);
					return false;
				}
				if(value.match(/(\d+)/i) == null){
					inputKeyFilter.TextAdd(isRussian() ?
							"Введите хотя бы одну цифру."
							: "The password must contain at least one digit."
						, elementInput, "uparrowdivyellow");
					inputKeyFilter.focus(elementInput);
					return false;
				}
				if(value.match(/([a-z]+)/) == null){
					inputKeyFilter.TextAdd(isRussian() ?
							"Введите хотя бы одну латинскую букву."
							: "The password must contain at least one letter."
						, elementInput, "uparrowdivyellow");
					inputKeyFilter.focus(elementInput);
					return false;
				}
				if(value.match(/([A-Z]+)/) == null){
					inputKeyFilter.TextAdd(isRussian() ?
							"Введите хотя бы одну заглавную латинскую букву."
							: "The password must contain at least one upper-case letter."
						, elementInput, "uparrowdivyellow");
					inputKeyFilter.focus(elementInput);
					return false;
				}
				return true;
			}
/*				
		//, null//onChange
		, function(event){//onChange
				input = this;
				inputKeyFilter.RemoveMyTooltip();
				if(!input.ikf.customFilter(input))
					return false;
				var elementNewPassword = document.getElementById("NewPassword");
				elementNewPassword.innerHTML = input.value;
			}
		//, null//onblur
		, function(event){//onblur
				this.ikf.customFilter(this);
			}
*/				
	);
</script>
 New password: <span id="NewPassword"></span>

</body>
</html>

Также см. Мою страницу «Электронная почта:» и «Пароль:» примера фильтра клавиш ввода

0 голосов
/ 25 ноября 2011

Вы можете использовать regexp для обоих этих

function validate(form_id,email) {

   var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
   var address = document.forms[form_id].elements[email].value;
   if(reg.test(address) == false) {

      alert('Invalid Email Address');
      return false;
   }
}

для электронной почты (источник: http://www.white -hat-web-design.co.uk / blog / javascript-validation / )

И используйте тот же метод для подтверждения вашего пароля.

http://www.w3schools.com/jsref/jsref_regexp_test.asp

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...