82 lines
3.1 KiB
JavaScript
82 lines
3.1 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
||
const inputs = document.querySelectorAll('#fluentform_3 .ff-el-form-control');
|
||
const phoneInput = document.querySelector('#fluentform_3 .ff-el-phone');
|
||
|
||
inputs.forEach(input => {
|
||
// Добавляем класс при фокусе
|
||
input.addEventListener('focus', function() {
|
||
this.closest('.ff-el-group').classList.add('focused');
|
||
});
|
||
|
||
// Убираем класс при потере фокуса
|
||
input.addEventListener('blur', function() {
|
||
this.closest('.ff-el-group').classList.remove('focused');
|
||
});
|
||
|
||
// Добавляем/убираем класс при вводе
|
||
input.addEventListener('input', function() {
|
||
const group = this.closest('.ff-el-group');
|
||
if (this.value.trim() !== '') {
|
||
group.classList.add('has-value');
|
||
} else {
|
||
group.classList.remove('has-value');
|
||
}
|
||
});
|
||
});
|
||
|
||
// Маска для телефона +7 (___) ___-__-__
|
||
if (phoneInput) {
|
||
phoneInput.addEventListener('input', function(e) {
|
||
let value = e.target.value.replace(/\D/g, ''); // Убираем все кроме цифр
|
||
|
||
// Если начинается с 8, заменяем на 7
|
||
if (value.startsWith('8')) {
|
||
value = '7' + value.slice(1);
|
||
}
|
||
|
||
// Если не начинается с 7, добавляем 7
|
||
if (!value.startsWith('7') && value.length > 0) {
|
||
value = '7' + value;
|
||
}
|
||
|
||
let formattedValue = '';
|
||
|
||
if (value.length > 0) {
|
||
formattedValue = '+7';
|
||
|
||
if (value.length > 1) {
|
||
formattedValue += ' (' + value.slice(1, 4);
|
||
|
||
if (value.length > 4) {
|
||
formattedValue += ') ' + value.slice(4, 7);
|
||
|
||
if (value.length > 7) {
|
||
formattedValue += '-' + value.slice(7, 9);
|
||
|
||
if (value.length > 9) {
|
||
formattedValue += '-' + value.slice(9, 11);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
e.target.value = formattedValue;
|
||
});
|
||
|
||
// Обработка клавиш для корректного удаления
|
||
phoneInput.addEventListener('keydown', function(e) {
|
||
if (e.key === 'Backspace' || e.key === 'Delete') {
|
||
const cursorPos = e.target.selectionStart;
|
||
const value = e.target.value;
|
||
|
||
// Если курсор на служебном символе, сдвигаем его
|
||
if (cursorPos > 0 && [' ', '(', ')', '-'].includes(value[cursorPos - 1])) {
|
||
setTimeout(() => {
|
||
e.target.setSelectionRange(cursorPos - 1, cursorPos - 1);
|
||
}, 0);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
}); |