I created a small form but the if / else structure hangs on the second try-CodePudding

I have a form that calculate the age of a person. I written two function. the first do the calculation and the second returns some if/else statement. I have a problem with the if/else statement. Whatever the age of the person, JS always returns the second if. I can't figure out how i can solve this problem.

Can someone help me?

HTML

<!DOCTYPE html>

<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="stile.css">
    </head>
    <body>

        <form id="anni">

        <input type="text" id="annoattuale">

        <input type="text" id="nascita">

        <button type="submit">Calcola</button>

    </form>
       
        
        
        <script src="script.js"></script>
    </body>
</html>

JS CODE

anni.onsubmit = function (e) {

e.preventDefault()




let attualita = document.querySelector("#annoattuale").value

let nascita = document.querySelector("#nascita").value






let calcolaEta = (attuale, annodiNascita) => attuale - annodiNascita


let calcolatriceEta = calcolaEta(attualita, nascita)


condizioniEta(calcolatriceEta)


    function condizioniEta (calcoloEta) {


    if(calcoloEta === 18) {

        console.log(`Hai ben ${calcoloEta}! Sei appena maggiorenne!`)
    }


    else if(calcoloEta >= 29) {

        console.log(`Hai ben ${calcoloEta}! Sei un giovane piuttosto maturo`)

    }


    else if(calcoloEta >= 49) {

        console.log(`Hai ben ${calcoloEta} e ti stai avvicinando alla vecchiaia`)

    }

    else if(calcoloEta >= 59) {

        console.log(`Hai ben ${calcoloEta} e sei entrato nella vecchiaia`)
    }

    else if(calcoloEta >= 69) {

        console.log(`Hai ben ${calcoloEta}... Ti potrebbe rimanere poco tempo da vivere...`)
    }

    else if(calcoloEta >= 89) {

        console.log(`Hai ben ${calcoloEta}... La morte è quasi vicina...`)
    }

    
}

CodePudding user response：

So one problem was the use of the same name for a variable and a function. The other problem was the fact that you didnt create conditions with "limits".

For example imagine that the age its 60, this number its bigger or equal to 29, so it will it true on this else if and will enter on it. So you need to create a rate [ Maximum and Minimum ]

anni.onsubmit = function (e) {

e.preventDefault()




let attualita = document.querySelector("#annoattuale").value

let nascita = document.querySelector("#nascita").value






let calcolaEta = (attuale, annodiNascita) => attuale - annodiNascita


let calcolatriceEta = calcolaEta(attualita, nascita)

condizioniEta(calcolatriceEta)
    

function condizioniEta (calcoloEtaChanged) {

        if(calcoloEtaChanged === 18) {

            console.log(`Hai ben ${calcoloEtaChanged}! Sei appena maggiorenne!`)
        }


        else if(calcoloEtaChanged >= 29 && calcoloEtaChanged >= 48) {

            console.log(`Hai ben ${calcoloEtaChanged}! Sei un giovane piuttosto maturo`)

        }


        else if(calcoloEtaChanged >= 49 && calcoloEtaChanged <= 58) {

            console.log(`Hai ben ${calcoloEtaChanged} e ti stai avvicinando alla vecchiaia`)

        }

        else if(calcoloEtaChanged >= 59 && calcoloEtaChanged <= 68) {

            console.log(`Hai ben ${calcoloEtaChanged} e sei entrato nella vecchiaia`)
        }

        else if(calcoloEtaChanged >= 69 && calcoloEtaChanged <= 88) {

            console.log(`Hai ben ${calcoloEtaChanged}... Ti potrebbe rimanere poco tempo da vivere...`)
        }

        else if(calcoloEtaChanged >= 89) {

            console.log(`Hai ben ${calcoloEtaChanged}... La morte è quasi vicina...`)
        }

        
    }
}