Форматирование входного значения как пользовательских типов

Question

У меня возникают трудности при обновлении значения полей ввода до валюты, когда пользователь вводит. Когда я использую изменение события ввода, я могу успешно обновить значение в валюте. Но когда я использую событие keyup, входное значение и поведение взаимодействия не очень удобны для пользователя.

Я попытался использовать setTimeout, но не могу добиться форматирования значения / валюты, поскольку пользователь вводит правильно.

Любые советы или предложения будут с благодарностью.

Пример:

myInputElement.addEventListener('keyup', function (e) {
 e.currentTarget.value = numeral(e.currentTarget.value).format('$0,0.00');
});

Answer 1

Сделать десятичные числа необязательными.

numeral(e.currentTarget.value).format('$0,0.[00]');

Answer 2

Попробуйте "input" eventListener. Это будет срабатывать каждый раз, когда вводится новый персонаж.

var myInputElement = document.getElementById("element");

myInputElement.addEventListener("input", function (e) {
  e.currentTarget.value = numeral(e.currentTarget.value).format('$0,0.00');
});