https://murkapravo.ru/script/inputmask2.js?v=2

1class InputMask {
2  constructor (props) {
3    this.el = this.getElement(props.selector);
4    if (!this.el) return console.log('Что-то не так с селектором');
5    this.layout = props.layout || '+_ (___) ___-__-__';
6    this.maskreg = this.getRegexp();
7    this.setListeners()
8    this.maskLayout = '+_(___) ___-__-__'
9    this.maskPos = -1
10    this.replaced = false
11  }
12
13  getRegexp = function () {
14    var str = this.layout.replace(/_/g, '\\d');
15    str = str.replace(/\(/g, '\\(');
16    str = str.replace(/\)/g, '\\)');
17    str = str.replace(/\+/g, '\\+');
18    str = str.replace(/\s/g, '\\s');
19    return str;
20  }
21
22  mask = function (e) {
23    var _this = e.target,
24      matrix = this.layout,
25      i = 0,
26      def = matrix.replace(/\D/g, ""),
27      val = _this.value.replace(/\D/g, "");
28  
29    if (def.length >= val.length) val = def
30    _this.value = matrix.replace(/./g, function (a) {
31      return /[_\d]/.test(a) && i < val.length ? val.charAt(i++) : i >= val.length ? "" : a;
32    })
33  
34    if (_this.value.length <= this.maskLayout.length) {
35      this.maskPos = _this.value.length
36      if (this.maskPos === 5 && !this.replaced && ['7','8'].indexOf(_this.value[3]) !== -1) {
37        _this.value = _this.value.substr(0, 3) + _this.value.substr(4, this.maskPos)
38        this.maskPos--
39        this.replaced = true
40      }
41      _this.value += this.maskLayout.substring(this.maskPos, this.maskLayout.length)
42    }
43  
44    if (e.type == "blur") {
45      var regexp = new RegExp(this.maskreg);
46      if (!regexp.test(_this.value)) _this.value = "";
47    } else {
48      this.setCursorPosition(this.maskPos, _this);
49    }
50  }
51
52  setCursorPosition = function (pos, elem) {
53    elem.focus();
54    if (elem.setSelectionRange) elem.setSelectionRange(pos, pos);
55    else if (elem.createTextRange) {
56      var range = elem.createTextRange();
57      range.collapse(true);
58      range.moveEnd("character", pos);
59      range.moveStart("character", pos);
60      range.select();
61    }
62  }
63
64  setListeners = function () {
65    this.el.addEventListener("input", this.mask.bind(this), false);
66    this.el.addEventListener("focus", this.mask.bind(this), false);
67    this.el.addEventListener("blur", this.mask.bind(this), false);
68    this.el.addEventListener('mouseup', e => {
69      e.preventDefault()
70      e.target.setSelectionRange(this.maskPos, this.maskPos)
71    }, false);
72  }
73
74  getElement = function (selector) {
75    if (selector === undefined) return false;
76    if (this.isElement(selector)) return selector;
77  
78    if (typeof selector == 'string') {
79      var el = document.querySelector(selector);
80      if (this.isElement(el)) return el;
81    }
82  
83    return false;
84  }
85
86  isElement = function (element) {
87    return element instanceof Element || element instanceof HTMLDocument;
88  }
89}
90
91// new InputMask({
92//   selector: document.querySelector('.user_tel_main'),
93//   layout: '+7(___) ___-__-__'
94// })