Feladat
Készítsen testtömegindex számítására alkalmas webes felületet!
A testtömegindex (TTI, vagy BMI - body mass index) az ember testtömegéből és a méterben mért magasságából
számított érték, mely felhívhatja a figyelmet az esetleges túlsúlyosságra vagy soványságra. Számítása a
következő képlettel történik:

Az így kapott eredmény pontos értelmezése egyebek mellett a
Wikipedia oldalán is
megtekinthető, azonban a feladat mostani megvalósításakor az alábbi egyszerűsített kiértékelés is
alkalmazható:
 |
 |
 |
BMI < 18 |
18 <= BMI <= 25 |
25 < BMI |
sovány testalkat |
normál testsúly |
túlsúlyosság |
1.
A feladat megvalósításának első lépéseként alakítson ki egy
űrlapot az adatok beírásához, és az
eredmény majdani megjelenítéséhez - például az alábbi kép mintájára:
2.
Ezt követően készítse el a testtömegindexet számító és megjelenítő
függvényt. Oldja meg, hogy a
függvény hívásához ne legyen szükség külön nyomógombra, hanem az adatok beírásával párhuzamosan
az eredmény is folyamatosan aktualizálódjon. Ennek megvalósításához alkalmazza az input elemek
paramétereként az
onkeyup eseményvezérlőt, mely minden billentyűfelengedés után
lefuttatja a meghívott függvényt.
<input ... onkeyup='szamol()'>
3.
Egészítse ki a programot azzal, hogy a testtömegindexet megjelenítő
mező háttérszíne igazodjék a
megjelenített számhoz:
- 18-nál kisebb érték esetén legyen a háttérszín sárga,
- normál érték esetén legyen a háttérszín zöld,
- 25-nál nagyobb érték esetén legyen a háttérszín piros.
Ennek megvalósításához javascriptből az input elem
.style.backgroundColor tulajdonságát
lesz szükséges módosítania, például így:
document.urlap.bmi.style.backgroundColor = '#8F8'
4.
Továbbfejlesztés céljából érdemes lehet újabb sorral bővíteni az űrlapot, melyben 25-nél nagyobb
testtömegindex esetén megjeleníthető a
súlytöbblet - vagyis hogy hány kg-tól kellene megszabadulni az
ideális testsúly eléréséhez. Fentiekre mutat mintát a következő ábra:

Ennek kiszámításához belátható módon (az eredeti képlet átrendezése után) az alábbi formulából
célszerű kiindulni:
súlytöbblet = kg - 25 * (cm/100)2
ahol a 25-ös érték az elérni kívánt testtömegindex felső határaként adódott.
5.
Természetesen a feladat másfajta megvalósításban is elkészíthető. A beírómezők helyett például használható
range típusú
párbeszédelem 
, és akár az is megoldható, hogy a
kiszámolt testtömegindexnek megfelelően a fenti emberkék közül a
megfelelő ábra jelenjen meg
a felület mellett:
Tipp1.
A range folyamatos számolásához az oninput eseményvezérlő paramétert
érdemes használni.
Tipp2.
Az ábra javascriptből történő cseréjének megvalósításához elsőként érdemes az ábra kiszemelt helyén
kialakítani egy az ábráknak megfelelő méretű (98x192px) keretet, vagyis div-et, melyet szükségszerű
azonosítóval ellátni (id paraméter, pl. testkep néven).
A folytatásban pedig ennek a div-nek az innerHTML tulajdonságát kell változtatgatni:
testkep.innerHTML = '<img src="body_correct.gif">'