Пишу свой плагин для форм отправки. Возник вопрос, как передавать свой аргумент, как это делается например в методе jquery
$('tut selector').each(function(item) {
})
Тут автоматом как-то передается аргумент item, который я могу использовать.
;(() => {
class Validation {
constructor(options) {
this.fields = options.fields;
this.formElement = document.querySelector(options.formSelector);
this._checkRules = {
phone: /^[+]*[(]{0,1}[0-9]{1,4}[)]{0,1}[-\s\./0-9]*$/,
mail: /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/,
}
}
init() {
if(Object.prototype.toString.call(this.fields) === '[object Array]') {
this.fields.map((item) => {
document.querySelector(item.fieldSelector).addEventListener('blur', (e) => {
//target - DOM элемент, поле
//item.text - Условие, по которому нужно проверять строку или регулярное выражение
//item.required - Обязательное ли поле
let failCallback = item.onFail ? item.onFail : this.onFail;
const target = event.target;
if(this.fieldTest(target, item.test, item.required) === false) {
failCallback();
} else {
onSuccess();
}
})
})
} else {
}
}
onSuccess() {
}
onFail() {
}
fieldTest(field, test = 'default', required = false) {
if(required && field.value == '') {
return false;
}
switch (test) {
case 'phone':
return this._checkRules.phone.test(field.value);
break;
case 'mail':
return this._checkRules.mail.test(field.value);
break;
case 'message':
return field.value.length < 5 ? false : true;
break;
default:
return true;
break;
}
}
}
var valide = new Validation({
formSelector: 'form',
fields: [
{
fieldSelector: '.name',
test: 'name',
required: true,
},
{
fieldSelector: '.phone',
test: 'phone',
onFail: () => {
alert('Коллбэк сработал');
}
},
{
fieldSelector: '.mail',
test: 'mail'
},
{
fieldSelector: '.ms',
test: 'message'
},
]
}).init();
})();
