Restar dos input type Number en JavaScript

[HackID1]

Buenas noches Foreros.

Por aquí ando de nuevo, estuve buscando como poder restar estos dos valores en JavaScript, los dos campos son de tipo NUMBER.

Me gustaría conocer como restarlos y además como Válidar Que de verdad se inserta un valor entre el min y max establecido en el input (porque en mi código no lo hace)

El código es tan simple como este:

Código Javascript:

Maximo:
    <input type="number" name="maximo" id="maximo" min="11" max="50"/>
    
Minimo:
    <input type="number" name="minimo" id="minimo" min="-2" max="10"/>
                            
                            
    Diferencia de temperaturas:
    <input type="text" id="diferencia" name="diferencia" value="" readonly />
 
 
 
    function calcula(){
 
        var a = Number (document.getElementById('maximo').value );
        var b = Number (document.getElementById('minimo').value );
 
        var c = a - b;
 
        document.getElementById('diferencia').value = c;
        
        //alert(document.getElementById('maxima').options[document.getElementById('maxima').selectedIndex].text);
    }
 

No me funciona aún no se como realizarlo la resta y mostrar la diferencia en el campo 'diferencia'.

Gracias y perdonar la duda, pero no consigo como restarlos en este modo de input.

Saludos

[Alexis88]

No sé qué problema encuentras porque lo acabo de probar y funciona como esperaba.

Saludos

[HackID1]

Buenas.

El error que encuentro o porque no me funciona correctamente es el siguiente:

La resta se debe realizar sin hacer un onclick en un botón, porque es justamente al rellenar los campos que se debe realizar, y luego el segundo error que veo, es que si digitas una cantidad por fuera del rango te la valida igual jeje.

Son esos dos fallos o soluciones que necesito realizar de alguna forma con JavaScript.

saludos y gracias

[Alexis88]

Ese no es un error del código sino tuyo al pensar que eso se iba a realizar de manera automática.

Lo primero se soluciona usando el evento change y lo segundo, con el evento keypress en donde evaluarás el valor ingresado y solo si no está dentro del rango, evitas que se complete el evento para lo cual puedes usar el método preventDefault.

Saludos

[HackID1]

De acuerdo solucionado, supongo no me estaba tomando bien el link externo de Script y era por eso que me fallaba.

Probé copiando el código dentro de mi HTML y funciono, ahora miraré lo que me comentas de válidar los rangos de min y máx de los campos.

Mil gracias amigo Alexis88 y disculpa las dudas básicas de JavaScript.


PD: El fallo era que no había cerrado el > de la etiqueta <SCRIPT> jeje. ya esta funcionando, debo continuar con los rangos aunque no son obligatorios ni mucho menos, pero no esta de más verlos para algo similar.