JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="elementXPosition" pattern="^[0-9]{1,3}(,[0-9]{3})" title="Please enter decimal numbers only" placeholder="Using pattern" />
<input type="text" id="elementYPosition" placeholder="Using jQuery" />
<input type="text" id="xyz" placeholder="With thousand separator"/>

JavaScript

$(document).ready(function () {
    $("#elementYPosition").keydown(function (e) {
        /*To check if shift key was pressed*/
        if (e.shiftKey == true) {
            e.preventDefault();
        }
        /*Allows some keys to be pressed*/
        if ((e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105) || e.keyCode == 8 || e.keyCode == 9 || e.keyCode == 37 || e.keyCode == 39 || e.keyCode == 46) {} else {
            e.preventDefault();
        }
    });
    $("#elementYPosition").change(function () {
        $("#elementYPosition").val($(this).val() / 1000);
    });
});
$('#xyz').blur(function(){
    
    $('#xyz').val(addCommas($('#xyz').val()));
});
function addCommas(nStr) {
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + '.' + '$2');
    }
    return x1 + x2;
}