JSFiddle - React, Tailwind, and code Playground

by yijiang

HTML

<input type="text" id="currency" />

JavaScript

var currency = $('#currency');

function formatCurrency(input) {
    var n = parseInt(input, 10).toString().split('');
    for (var i = n.length - 3; i > 0; i -= 3) {
        n.splice(i, 0, ',');
    }
    return '$' + n.join('');
}

currency.blur(function() {
    if(!isNaN(parseInt(this.value, 10))){
        $(this).data('source', this.value); 
        this.value = formatCurrency(this.value);
    } else {
        // Warn user of invalid input 
    }
}).focus(function() {
    this.value = $(this).data('source');
}).data('source', '');