Как динамически автоматически отформатировать число в американскую валюту, используя только jQuery?

Question

Я создаю форму, и мне нужно текстовое поле, в котором пользователь может вводить цены или сборы.

Я видел форму, которая может делать то, что я ищу, но я не уверен, как это сделать. То, что я ищу, по умолчанию, текстовое поле содержит $0,00. Когда пользователь начинает вводить число, оно действует следующим образом: 12345678 начинается с 0,01 > 0,12 > 1,23 > --- > $123 456,78.

Он должен автоматически добавлять запятые, когда это необходимо, и период для центов, позволяя только 2 цифры в правой части периода.

Также необходимо заблокировать возможность ввода нецифровых символов, отличных от запятой и точки. Поэтому, если бы пользователь должен был ввести "а", вместо того, чтобы отобразить "а", а затем внезапно удалить, я даже не хочу видеть "а".

Answer 1

Я хотел бы начать с предложения <input type="number"/> ограничить ввод только цифрами. Далее приведено регулярное выражение для обработки двух десятичных знаков и запятых.

var money = number.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');

куда number это номер, который вы получите при регистрации. Это должно работать при вызове на входе.

$('input[type="number"]').on('keyup', function(e){
    var number = Number($(this).val());
    var money = number.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
    $(this).val(money);
});

Эта часть - только начало. Есть несколько условий, которые вам нужно вставить. Например, вы можете проверить наличие нажатой клавиши, прежде чем разрешить изменение. Вы можете сделать это, проверив коды клавиш.