【javascriptでカウントダウンタイマーを作る】part.3 忘備録

完成形のイメージ

日本人の平均男性が80歳ぐらいまで生きると想定し、
自分の年齢を入力して余生を日数ではなく時間単位でカウントダウン表示する

実装したい機能を言語化しよう

"１日の睡眠時間と選択した年齢から余生を〜時間で出力する"

今日の課題は「年齢を入力したら80歳まで生きるとして乗り時間を表示させる」

「人生の残り時間」 = "１日の起きている時間 × 1年間" × "80 - 自分の年齢"

life_timer.js

//年齢を選択する時に発火する関数
    setAgeNumber();

    function setAgeNumber(){
        for(var i = 10; i <= 80; i ++){
            var option = document.createElement("option");
            option.value = i;
            option.innerText = i;
            Age.appendChild(option);
        }
    }

    //年齢を選択するプルダウンメニューを変更したら発火
    Age.addEventListener('change',function(){
        var ageValue = document.getElementById("age").value;

        //余生の時間を計算
        leftLifeTime += (hoursLeft - ageValue); 
        alert(leftLifeTime);
    });


    //睡眠時間を選択する際に発火する関数
    setSleepNumber();

    function setSleepNumber(){
        for(var i = 1; i <= 24; i++){
            var option = document.createElement("option");
            option.value = i;
            option.innerText = i;
            Sleep.appendChild(option);
        }
    }

    //睡眠時間を選択するプルダウンメニューを変更したら発火
    Sleep.addEventListener('change',function(){
        var sleepValue = document.getElementById("sleep").value;

        //残り時間を計算 
        awakeTime = (dayHours - sleepValue) * 365 * leftLifeTime;
        alert(awakeTime);
    });

課題

取得できた残り時間の値をカウント時間として表示させる