soustraction input html revoie NaN en javascript

Bonjour,
J'ai trois champs input comme ceci :

Code:

1
2
3
<b>Montant total  : </b> <input type="text" name="montant_total" id="montant_total" disabled="disabled" size="12" ></input>
  <b>Montant encaissé  : </b> <input type="text" name="montant_recup" id="montant_recup" size="12"  oninput="cal_monnaie()"></input> 
 <b>Montant rendu  : </b> <input type="text" name="rendu" id="rendu" size="12"></input>

la fonction cal_monnaie() se code comme ceci

Code:

1
2
3
4
5
6
7
8
9
10
function cal_monnaie()
	{
		const montant_tot=$("#montant_total").val();
	const montant_encaisse=$("#montant_encaisse").val();
 
    const montant_rendu=parseFloat( montant_tot) - parseFloat(montant_encaisse);
 
	document.getElementById("rendu").value=montant_rendu;	
 
 }

mais ça me revoie NaN dans le champ montant rendu

Quelle est mon erreur ?