В данном коде (используется для создания маски телефона на сайте), не могу понять как устранить один недостаток, при автозаполнении первая восьмерка не удаляется, а становится сразу за 7, что естественно приводит к не корректной отправке номера.
Заранее благодарю за помощь.
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.11/jquery.mask.min.js"></script>
<script type="text/javascript">
jQuery.browser = {};
(function () {
jQuery.browser.msie = false
jQuery.browser.version = 0;
if (navigator.userAgent.match(/MSIE ([0-9]+)\\./)) {
jQuery.browser.msie = true;
jQuery.browser.version = RegExp.$1
}
})();
</script>
<script>
cr.api(page => {
const errorTitle = 'Ошибка' /* Заголовок сообщения об ошибке */
const errorText = 'Неправильно указан номер телефона' /* Текст сообщения об ошибке */
const characters = 10 /* Минимальное количество цифр в номере телефона */
const template = '+7 (000) 000-00-00'
const startContent = '+7'
$.jMaskGlobals = {}
$.jMaskGlobals.maskElements = 'input'
$.jMaskGlobals.translation = {
"0": { pattern: /\d/ },
"+": { pattern: /\+/, optional: true }
}
page.waitForAppear('[cr-field="phone"]', field => {
const namePosition = getProp(field.querySelector('.name'), 'position')
const input = field.querySelector('input')
if (namePosition == 'static') setMask(input)
else input.addEventListener('focus', () => setMask(input))
input.addEventListener('input', () => {
if (!input.value) return setMask(input)
input.value = input.value.replace(/(\+7\s?\(?)(\+?7|8)/, '$1')
setStartContent(input)
})
})
page.on('before-form-submit', event => {
const apiPhoneFields = event.form.fields.filter(apiField => {
return apiField.type == 'phone'
})
apiPhoneFields.forEach(apiField => {
const phoneNumber = apiField.value.replace(/\D/g, '')
if (phoneNumber.length < characters) {
page.showErrorMessage(errorTitle, errorText)
event.prevent()
}
})
})
function setMask(input) {
if (!input) return
$(input).mask(template, { selectOnFocus: false })
setStartContent(input)
}
function setStartContent(input) {
if (!input) return
const value = input.value ? input.value : ''
if (!value.startsWith(startContent)) {
input.value = startContent + value
}
}
function getProp(el, prop) {
if (!el || !prop) return
return getComputedStyle(el, null).getPropertyValue(prop)
}
})
</script>