Нужен совет по юзабилити текстового редактора

var inp = document.getElementById('inp');
inp.onkeypress = (event) => {
    if(!/[\d.,]/i.test(event.key)){
        alert(event.key + ' - недопустимый символ!');
        return false;
    }
}
inp.onblur = (event) => {
    var str = inp.value;
    var mistake = '';
    var correctly = '';
    for(var i = 0; i < str.length; i++){
        if((/[\d.,]/i.test(str[i])))
            correctly += str[i];
        else
            mistake += str[i];
    }
    correctly = correctly.match(/\d+[.|,]?\d?/);
    alert('Вы ввели недопустимые символы: ' +  mistake);
    inp.value = correctly[0];
}

input.oninput = function() {
  var arr = [];
  this.value = this.value.replace(/[^a-z0-9\.,!]/gi, function(char) {
    arr.push(char);
    return '';
  });
  if (arr.length) alert('Недопустимые символы: ' + arr.join(', '));
}

var inp = document.getElementById('inp');
var hint = document.getElementById('hint');
 
inp.onkeypress = (event) => {
    if(!/[\d.,]/i.test(event.key)){
        showHint(event.key);
        return false;
    }
}
inp.onblur = (event) => {
    var str = inp.value;
    var mistake = '';
    var correctly = '';
    for(var i = 0; i < str.length; i++){
        if((/[\d.,]/i.test(str[i])))
            correctly += str[i];
        else
            mistake += str[i];
    }
    correctly = correctly.match(/\d+[.|,]?\d?/);
    showHint(mistake);
    console.log(correctly[0]);
    inp.value = correctly[0];
}
function showHint(str) {
    hint.style.display = 'inline-block';
    if(str == ' ')
        str = 'space';
    hint.innerHTML = 'Недопустимые символы: <span class="ch">' + str + '</span><br>будут удалены';
    setTimeout(hideHint, 3000);
}
function hideHint() {
    hint.style.display = 'none';
}

const mask = /([^\d.,]+)/g,
    notice = document.querySelector('.notice');
 
document.querySelector('.input').addEventListener('input', function() {
    let str = this.value,
        match = str.match(mask);
    if (match) {
        let message = str
            .substring(
                str.indexOf(match[0]),
                str.lastIndexOf(match[match.length - 1]) + match[match.length - 1].length)
            .replace(mask, '<span>$&</span>').replace(/\s/g, "<i>␣</i>");
 
        notice.innerHTML = message;
        notice.classList.add('show');
        this.value = str.replace(mask, '');
    } else {
        notice.classList.remove('show');
    }
});