JSFiddle - React, Tailwind, and code Playground

HTML

<input id="a" name="" type="text" value="$500.45" onChange= "hello();">

JavaScript

function getCursorPosition(obj) {
        var el = obj.get(0);
        var pos = 0;
        if('selectionStart' in el) {
            pos = el.selectionStart;
        } else if('selection' in document) {
            el.focus();
            var Sel = document.selection.createRange();
            var SelLength = document.selection.createRange().text.length;
            Sel.moveStart('character', -el.value.length);
            pos = Sel.text.length - SelLength;
        }
        return pos;
    }
function hello()
{
    alert("hi");
}
	function hai(obj,e){
        alert("hai");
		 var keycode= (e.keyCode ? e.keyCode : e.which);
		 
		 if(keycode == 8){
			var position =getCursorPosition(obj);
			var ca=obj.value.slice(0,position).split('')
			var x=ca[ca.length-1]
			if(x==='$'||x==='.'){e.preventDefault()}			 
		}
		
		if(keycode == 46){
			var position = getCursorPosition(obj);
			var ca=obj.value.slice(0,position+1).split('')
			var x=ca[ca.length-1]
			if(x==='$'||x==='.'){e.preventDefault()}			 
			
			}
	}