2

私はJavascriptが初めてで、誰かが私が間違っていることを理解するのを手伝ってくれたらありがたいです. 入力フィールドから値を取得して、台形の表面積を計算しようとしています。「Sを計算する」ボタンを押すと、答えとして「ナン」が得られます。これは、HTML コードの主要部分です。

    <form method="post">
    <label for="a">a</label>
    <input type="text" id="a"/> <br/>
    <label for="b">b</label>
    <input type="text" id="b"/> <br/>
    <label for="h">h</label>
    <input type="text" id="h"/> <br/>
    <button onclick="alert(S)">Calculate S</button>
    </form>

そして、これは私が値を取得して表面を計算するために使用しているスクリプトです:

           <script type="text/javascript">
            var a=parseInt(document.getElementById("a"), 10);
            var b=parseInt(document.getElementById("b"), 10);
            var h=parseInt(document.getElementById("h"), 10);
            var S=parseInt(((a+b)/2)*h, 10);
        </script>

前もって感謝します!

4

2 に答える 2

2

次のように、入力だけでなく、各入力から値を取得する必要があります。

       <script type="text/javascript">
        var a=parseInt(document.getElementById("a").value, 10);
        var b=parseInt(document.getElementById("b").value, 10);
        var h=parseInt(document.getElementById("h").value, 10);
        var S=((a+b)/2)*h;
    </script>
于 2013-08-27T19:23:31.590 に答える
1
  1. .value入力要素のプロパティを使用して内容を取得します。それを呼び出しparseIntて番号取得します。
  2. 結果も必要ありませんparseInt
    var S = ((a + b) / 2) * h;
  3. ボタンのクリック時にコードを実行したい場合は、呼び出し可能な関数でコードをラップします (コードがブラウザーによって解析されたときに実行されます)。

ここにある例: http://jsfiddle.net/bpwEh/

更新されたコード:

<head>
    <!-- ... -->
    <script>
        function calc(){
            var a=parseInt(document.getElementById("a").value, 10);
            var b=parseInt(document.getElementById("b").value, 10);
            var h=parseInt(document.getElementById("h").value, 10);
            return ((a+b)/2)*h, 10;
        }
     </script>
</head>
<body>
    <form method="post">
        <label for="a">a</label>
        <input type="text" id="a"/> <br/>
        <label for="b">b</label>
        <input type="text" id="b"/> <br/>
        <label for="h">h</label>
        <input type="text" id="h"/> <br/>
        <button onclick="alert(calc()); return false;">Calculate S</button>
    </form>
</body>
于 2013-08-27T19:21:59.730 に答える