Dúvida - JavaScript

02/02/2020

0

Estou tentando selecionar a idade de um usuário por meio de um input range e retorna um resultado de acordo com o valor do mesmo. ex: "if(age > 1 && age <=6) result.innerHTML = "Child". Porém, ao atribuir o nodeValue do range à variável idade não consigo retornar um resultado. Se alguém puder me ajudar eu ficaria mt grato :)

Abs!


<input type="range" name="a" id="range">
<p id="result"></p>

<script>
function setAge() {
const rangeElement = document.getElementById('range');

const result = document.getElementById('result');

const age = rangeElement.nodeValue

}

</script>
Rômulo

Rômulo

Responder

Post mais votado

04/02/2020

Olá amigo. Fiz uns testes, veja como ficou e funcionou o código:
<input type="range" name="a" id="range" min="0" max="99" onchange="setAge();">
<p id="result"></p>

<script>
    function setAge() {
        const rangeElement = document.getElementById('range');

        const result = document.getElementById('result');

        const age = rangeElement.value;

        alert(age);

        if(age > 1 && age <=6) result.textContent = "Child";

        if(age > 6 && age <= 12) result.textContent = "Young";

        if(age > 12 && age <= 17) result.textContent = "Teenager";

        if(age >= 18) result.textContent = "Adult";

    }

</script>


Compare com seu código e veja as diferenças.

Espero ter ajudado. :D

Alex William

Alex William
Responder

Mais Posts

07/02/2020

Rômulo

Olá Alex! Obrigado pela ajuda, como estou começando não sei todos os eventos presentes nos elementos da dom, tampouco quando usá-los, mas estou no caminho!

A propósito, você teria uma sugestão pra implementar nesse código para reduzir o número de if e else?
Responder

Que tal ter acesso a um e-book gratuito que vai te ajudar muito nesse momento decisivo?

Ver ebook

Recomendado pra quem ainda não iniciou o estudos.

Eu quero
Ver ebook

Recomendado para quem está passando por dificuldades nessa etapa inicial

Eu quero

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar