У меня есть поле ввода, где я проверяю эти два условия...
Если поле ввода заканчивается доменом специфический
$('#newsletter_submit').on('click', function () {
document.getElementById('newsletter_text').removeAttribute('required')
var $emailFieldValue = $('#newsletter_text').val();
var $splitEmailFieldValue = $emailFieldValue.split('@');
var $result = $('#result')
function isValidEmailAddress(emailAddress) {
var pattern = /^([a-z\d!#$%&'*+\-/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'*+\-/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)*|"((([ \t]*\r\n)?[ \t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))*(([ \t]*\r\n)?[ \t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i;
return pattern.test(emailAddress);
}
if (!isValidEmailAddress($emailFieldValue)) {
$result.animate({ 'opacity': 0 }, 0, function () {
$(this).text('Must be a valid email format').css('color', 'red');
}).animate({ 'opacity': 1 }, 500);
var obj = {}
obj['$emailFieldValue'] = $emailFieldValue
console.info('obj.$emailFieldValue', typeof obj.$emailFieldValue)
if (($splitEmailFieldValue[1].toLowerCase()) !== 'acme.com')) {
$result.animate({ 'opacity': 0 }, 0, function () {
$(this).text('Only Acme employees can register i.e. [email protected]').css('color', 'red');
}).animate({ 'opacity': 1 }, 500);
}
} else {
$result.animate({ 'opacity': 0 }, 0, function () {
$(this).text('Thanks for registering').css('color', 'green');
}).animate({ 'opacity': 1 }, 500);
}
})
В настоящее время он просто игнорирует специфическое для домена условное выражение и позволяет ввести [email protected], и я получаю сообщение об ошибке:
Uncaught TypeError: Cannot read property 'toLowerCase' of undefined
Не уверен, почему это происходит, поскольку я проверил:
var obj = {}
obj['$emailFieldValue'] = $emailFieldValue
console.info('obj.$emailFieldValue', typeof obj.$emailFieldValue)
И получить строку?! Но ошибка говорит undefined?
@Taplar Спасибо за ответ... Строка!
Нет, это массив. Поэтому при регистрации он должен печатать массив в консоли. Какова его ценность? Предположительно, он должен печатать на консоли ['clark.kent', 'dailyplanet.com']
Также в качестве примечания; с точки зрения безопасности ограничение доменов электронной почты должно выполняться на стороне сервера, а не на стороне клиента. Или не только на стороне клиента. Есть простые способы обойти вашу логику.
@Taplar Ой, извините, я неправильно это понял...
@Taplar Спасибо за эту рекомендацию. Это потому, что пользователям будет сложно заниматься злонамеренной деятельностью?
Пользователи не могут вмешиваться в работу вашего сервера кода. Они могут легко перехватывать/изменять запросы, сделанные из браузера, до того, как они достигнут вашего сервера.
@Taplar Спасибо! Я полагаю через само поле ввода?
Пользователю вообще не нужно вмешиваться в поле. Как я уже сказал, они могут сами перехватывать/изменять запросы. Либо путем воспроизведения запросов от инструментов разработчика, либо существуют плагины для браузера, которые позволяют разработчикам вмешиваться в запросы.
@Taplar Спасибо за 411. Я слежу за этим!



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Я рекомендую разделить валидацию и позже сделать валидацию, посмотреть.
function isValidEmailAddress(emailAddress) {
var pattern = /^([a-z\d!#$%&'*+\-/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+(\.[a-z\d!#$%&'*+\-/=?^_`{|}~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+)*|"((([ \t]*\r\n)?[ \t]+)?([\x01-\x08\x0b\x0c\x0e-\x1f\x7f\x21\x23-\x5b\x5d-\x7e\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|\\[\x01-\x09\x0b\x0c\x0d-\x7f\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))*(([ \t]*\r\n)?[ \t]+)?")@(([a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\d\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.)+([a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]|[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF][a-z\d\-._~\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]*[a-z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])\.?$/i;
return pattern.test(emailAddress);
}
function isValidDomainAddress(emailAddress) {
return emailAddress.toLowerCase() === 'acme.com';
}
$('#newsletter_submit').on('click', function () {
document.getElementById('newsletter_text').removeAttribute('required')
var $emailFieldValue = $('#newsletter_text').val();
var $splitEmailFieldValue = $emailFieldValue.split('@');
var $result = $('#result');
var isValid = isValidEmailAddress($emailFieldValue);
if (!isValid) {
$result.animate({ 'opacity': 0 }, 0, function () {
$($result).text('Must be a valid email format').css('color', 'red');
}).animate({ 'opacity': 1 }, 500);
}
var obj = {}
obj['$emailFieldValue'] = $emailFieldValue
console.info('obj.$emailFieldValue', typeof obj.$emailFieldValue);
var isValidDomain = isValid? isValidDomainAddress($splitEmailFieldValue[1]): false;
if (isValid && !isValidDomain) {
$result.animate({ 'opacity': 0 }, 0, function () {
$(this).text('Only Acme employees can register i.e. [email protected]').css('color', 'red');
}).animate({ 'opacity': 1 }, 500);
}
if (isValid && isValidDomain){
$result.animate({ 'opacity': 0 }, 0, function () {
$(this).text('Thanks for registering').css('color', 'green');
}).animate({ 'opacity': 1 }, 500);
}
});
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id = "newsletter_text" required/>
<div id = "result"></div>
<br/>
<button id = "newsletter_submit" type = "button">Submit</button>Спасибо Хуан! Это то, что я хотел!
Что такое console.info
$splitEmailFieldValue?