Доброй ночи!
Прошу не пинать т.к я не большой специалист.
Имеется код установлен в движке joomla
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!-- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> -->
<script src="домен/jquery.inputmask.js" type="text/javascript"></script>
<script src="домен/jquery.bind-first-0.1.min.js" type="text/javascript"></script>
<script src="домен/jquery.inputmask-multi.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script>
(jQuery(function() {
jQuery("#popup").css('zIndex',9999);
jQuery("#popup").dialog({
modal: true,
dialogClass: "popup",
width: 'auto',
minWidth: 300,
//zIndex: 9999999,
//show: slide,
//title: 'ТЕКСТ',
autoOpen: true,
opacity: 0.3,
//position:'center',
open: function(event, ui) {
jQuery(".ui-widget-overlay").on("click", function() {
jQuery("#popup").dialog('close')
})
}
})
var delay_popup = 1000;
setTimeout(function() {
jQuery("#popup").dialog('open')
}, delay_popup);
}))(jQuery);
</script>
<script>
var maskList = jQuery.masksSort(jQuery.masksLoad("домен/callback/phone-codes.json"), ['#'], /[0-9]|#/, "mask");
var maskOpts = {
inputmask: {
definitions: {
'#': {
validator: "[0-9]",
cardinality: 1
}
},
clearIncomplete: true,
showMaskOnHover: false,
autoUnmask: true
},
match: /[0-9]/,
replace: '#',
list: maskList,
listKey: "mask",
onMaskChange: function(maskObj, determined) {
if (determined) {
var hint = maskObj.name_ru;
if (maskObj.desc_ru && maskObj.desc_ru != "") {
hint += " (" + maskObj.desc_ru + ")";
}
jQuery("#descr").html(hint);
} else {
jQuery("#descr").html("");
}
jQuery(this).attr("placeholder", $(this).inputmask("getemptymask"));
}
};
var listRU = jQuery.masksSort(jQuery.masksLoad("phones-ru.json"), ['#'], /[0-9]|#/, "mask");
var optsRU = {
inputmask: {
definitions: {
'#': {
validator: "[0-9]",
cardinality: 1
}
},
//clearIncomplete: true,
showMaskOnHover: false,
autoUnmask: true
},
match: /[0-9]/,
replace: '#',
list: listRU,
listKey: "mask",
onMaskChange: function(maskObj, determined) {
if (determined) {
if (maskObj.type != "mobile") {
jQuery("#descr").html(maskObj.city.toString() + " (" + maskObj.region.toString() + ")");
} else {
jQuery("#descr").html("мобильные");
}
} else {
jQuery("#descr").html("");
}
jQuery(this).attr("placeholder", jQuery(this).inputmask("getemptymask"));
}
};
jQuery('#phone_mask, input[name="mode"]').change(function() {
if (jQuery('#phone_mask').is(':checked')) {
if (jQuery('#is_world').is(':checked')) {
jQuery('#customer_phone').inputmasks(maskOpts);
} else {
jQuery('#customer_phone').inputmasks(optsRU);
}
} else {
jQuery('#customer_phone').inputmask("[####################]", maskOpts.inputmask)
.attr("placeholder", jQuery('#customer_phone').inputmask("getemptymask"));
jQuery("#descr").html("");
}
});
jQuery('#phone_mask').change();
</script>
<script>
$( "button" ).button();
</script>
<div id="popup">
<p><span style="font-size: 14pt;">Мы очень рады. Давайте мы перезвоним Вам в течение 1 минуты!<br>
Звонок бесплатный!</span></p><br>
<form action="<? echo JRoute::_($url); ?>" method="post">
<input class="clbh_banner-textbox" id="customer_phone" type="text" value="8" size="30" maxlength="11" name="txtphonenumber">
<button class="clbh_banner-button" id="clbh_send">Жду звонка</button>
<input type="radio" id="phone_mask" checked>
<label id="descr" id="phone_mask"></label>
<p>Введите ваш телефон без 8<br>
<small align="center">Уточняйте тарификацию звонков в роуминге у своего оператора связи</small></p>
<br>
</form>
Но при наборе номер, происходит перескакивание цифр как показано на рисунке

, не могу разобраться где возможная ошибка.