0

私はプログラミングのまったくの初心者です。Codecademy for JavaScript でしばらくの間演習を行ってきましたが、まだ知らない/理解していないことが明らかに大量にあります。これらの演習でいくつかのことを書きましたが、誰も持っていないか、実際に使用することはありません。もう少し続けようと思っていたのですが、今日仕事でちょっとしたことをする機会があり、挑戦したいと思ったのでやってみることにしました。

アイデアは、人々が基本的な情報を入力できるフォームを作成し、減量の目標に適合する1日のカロリー量を設定できるようにすることです. これは、基礎代謝率、ハリス ベネディクト式に基づいており、私の会社の特定のプログラムに合わせて少しひねりを加えたものです。

Dreamingincode で基本的な BMR 計算機の Javascript を見つけることができたので、それを修正して必要な調整を行いました。そのプロセスのどこかで、何かが間違っています。ファイルを .html ファイルとして保存してブラウザで開くと、フォームが表示され、すべて入力できますが、ボタンをクリックすると画面が更新されるだけです。

自分が何をしているのかを実際に知っている皆さんにとって、これはばかげていることはわかっていますが、私は本当にこれを機能させたいと思っています。勇敢になりたいと思う人がいるなら、私が持っているものを見て、私がどこで失敗したか教えてください.

<html>
<head>
<title>Daily Calorie Goal</title>

</head>
<body>

<script type="text/javascript" language="javascript">

function Calculate() {

    var gender = document.getElementById("gender").value;
    var weight = document.getElementById("weight").value;
    var height = document.getElementById("height").value;
    var age = document.getElementById("age").value;
    var goal = document.getElementById("goal").value;

    if(gender=="male") 
        {
            val1 = 6.23 * weight;
            val2 = 12.7 * height;
            val3 = 6.8 * age;
            dailyDeficit = (goal * 3500) / 90;

            result = 66 + val1 + val2 - val3;

            cals = result * 1.55;
            calMax = cals - dailyDeficit;

        }
    else if (gender=="female")
        {
            val1 = 6.23 * weight;
            val2 = 4.7 * height;
            val3 = 4.7 * age;
            dailyDeficit = (goal * 3500) / 90;

            result = 655 + val1 + val2 - val3;

            cals = result * 1.55;
            calMax = cals - dailyDeficit;
        }



    document.write ('This is your Daily Calorie Goal. To achieve your goal, just consume fewer than this number of calories every day:<b>   ' + calMax.toFixed(2) + '</b><br>');

}



</script>

<form action="#">
    Gender  : <select id="gender"><option value="male">Male</option><option value="female">Female</option></select><br />
    Weight (lbs.)   : <input type="text" id="weight" /><br />
    Height (inches): <input type="text" id="height" /><br />
    Age     : <input type="text" id="age" /><br />
    Goal    : <select id="Goal"><option value=5>Lose 5 Pounds</option><option value=10>Lose 10 Pounds</option><option value=15>Lose 15 Pounds</option><option value=20>Lose 20 Pounds</option><option value=25>Lose 25 Pounds</option></select><br />


    </fieldset>
    <input type="submit" value="Get My Daily Calorie Goal" onclick="Calculate()" />
</form>
</html>
4

3 に答える 3

1

ID（目標）の1つが大文字で綴られていて、ボタンが送信タイプだったため、サーバーに送信しようとしていました。 

 <html>
    <head>
    <title>Daily Calorie Goal</title>

    </head>
    <body>

    <script type="text/javascript" language="javascript">

    function Calculate() {

        var gender = document.getElementById("gender").value;
        var weight = document.getElementById("weight").value;
        var height = document.getElementById("height").value;
        var age = document.getElementById("age").value;
        var goal = document.getElementById("goal").value;

        if(gender=="male") 
            {
                val1 = 6.23 * weight;
                val2 = 12.7 * height;
                val3 = 6.8 * age;
                dailyDeficit = (goal * 3500) / 90;

                result = 66 + val1 + val2 - val3;

                cals = result * 1.55;
                calMax = cals - dailyDeficit;

            }
        else if (gender=="female")
            {
                val1 = 6.23 * weight;
                val2 = 4.7 * height;
                val3 = 4.7 * age;
                dailyDeficit = (goal * 3500) / 90;

                result = 655 + val1 + val2 - val3;

                cals = result * 1.55;
                calMax = cals - dailyDeficit;
            }



        document.write ('This is your Daily Calorie Goal. To achieve your goal, just consume fewer than this number of calories every day:<b>   ' + calMax.toFixed(2) + '</b><br>');

    }



    </script>

    <form action="#">
        Gender  : <select id="gender"><option value="male">Male</option><option value="female">Female</option></select><br />
        Weight (lbs.)   : <input type="text" id="weight" /><br />
        Height (inches): <input type="text" id="height" /><br />
        Age     : <input type="text" id="age" /><br />
        Goal    : <select id="goal"><option value=5>Lose 5 Pounds</option><option value=10>Lose 10 Pounds</option><option value=15>Lose 15 Pounds</option><option value=20>Lose 20 Pounds</option><option value=25>Lose 25 Pounds</option></select><br />


        </fieldset>
        <input type="button" value="Get My Daily Calorie Goal" onclick="Calculate()" />
    </form>
    </html>
于 2012-08-15T23:05:22.353 に答える
1

画面のクリアは の副作用ですdocument.write。おそらくあなたが望むのは、テキストを含む要素を持つことです。

form 要素の後に、holder 要素を追加できます。

<div id="result"></div>

次に、その内容を設定できます。

document.getElementById("result").textContent = "This is your daily...";
于 2012-08-15T23:05:48.553 に答える
1

ここでこれを変更するだけです：

var goal = document.getElementById("goal").value;

これに

var goal = document.getElementById("Goal").value;
于 2012-08-15T23:06:17.820 に答える