Real-time values in the input class type="range"

Take a look at this example: link

In practice you do not need jQuery and you have two options. Listen to the input event that changes with each step the mouse moves, or hear the mouseup event that triggers only when the mouse rises.

The sample code is:

var p = document.getElementById("price"),
    res1 = document.getElementById("resultado1"),
    res2 = document.getElementById("resultado2");

p.addEventListener("input", function () {
    res1.innerHTML = "€" + p.value;
}, false);
p.addEventListener("mouseup", function () {
    res2.innerHTML = "€" + p.value;
}, false);

But if you want to use jQuery, in some cases it may have advantages, so what you need is:

$('seletorElemento') // um seletor CSS
    .on('mouseup',   // quando ocorrer um mouse up naquele elemento... (pode também usar o "input"
    function(){
        // aqui pode correr o código que precisa, por exemplo mostrar o valor
        $('outroElemento').html(this.value); // no caso de querer mudar o html
    });

Without the comments:

$('#price').on('mouseup', function () {
    $('#resultado1').html(this.value);
});

Example