1

1 から 10 までの値を持つ、ボタンを備えた一種の「電卓」を作成する必要があります。次に、たとえば「1」を押すと、結果ボックスに「1」が表示され、「4」を押すと結果が表示されます。 「=」ボタンを押さなくても、自動的に「5」が出力されます。

値を加算するだけで、リセット機能が必要です。

Javascript は私にとってかなり新しいものです。私はまだそれを書くのが得意ではありませんが、ほとんどすべてを理解しています。

誰かが私を助けてくれることを本当に願っています！

これは私の現在のコードです：

    <html>
<head>
<style type="text/css">
table.calc {
     border: 2px solid #0034D1;
     background-color: #809FFF;
}
input.calc {
     width: 100%;
     margin: 5px;
}
</style>

<script>
function pushButton(buttonValue) {
     if (buttonValue == 'C') {
          document.getElementById('screen').value = '';
     }
     else {
          document.getElementById('screen').value += buttonValue;
     }
}
function calculate(equation) {
     var answer = eval(equation);
     document.getElementById('screen').value = answer;
}

</script>
</head>

<body>
<table class="calc" cellpadding=4>
<tr><td colspan=3><input class="calc" id="screen" type="text"></td></tr>
<tr>
<td><input class="calc" type="button" value=1 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=2 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=3 onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=4 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=5 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=6 onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=7 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=8 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value=9 onclick="pushButton(this.value);"></td>
</tr>
<tr>
<td><input class="calc" type="button" value=0 onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='.' onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='C' onclick="pushButton(this.value);"></td>
<td><input class="calc" type="button" value='+' onclick="pushButton(this.value);"></td>
</tr>
<tr><td colspan=3><input class="calc" type="button" value='=' onclick="calculate(document.getElementById('screen').value);"></td></tr>
</table>

</body>
</html>
4

2 に答える 2

1

parseInt文字列を連結するJavaScriptの「機能」を使用しているため（文字列+数値も文字列に等しい）、各数値の前後に必要です。また、parseIntを使用しているので、画面の値を''ではなく0（ゼロ）に設定する必要があります。

<input class="calc" id="screen" value="0" type="text">

次に、これを変更します。

function pushButton(buttonValue) {
     if (buttonValue == 'C') {
          document.getElementById('screen').value = '0';
     }
     else {
          document.getElementById('screen').value = 
            parseInt(document.getElementById('screen').value) + 
            parseInt(buttonValue);
     }
}

注：を押します。（ドット）または+（プラス）はエラーを引き起こします。それが押されたら、別の関数を呼び出す必要があると思います。

于 2012-05-22T19:09:48.410 に答える
0 
            <html>
        <head>
        <style type="text/css">
        table.calc {
             border: 2px solid #0034D1;
             background-color: #809FFF;
        }
        input.calc {
             width: 100%;
             margin: 5px;
        }
        </style>

        <script>
        function pushButton(buttonValue) {
             if (buttonValue == 'C') {
                  document.getElementById('screen').value = '0';
             }
             else {//this is where most changes occured
                    var x= document.getElementById('screen').value 
                    x =parseInt(x)+ parseInt(buttonValue);
                    document.getElementById('screen').value=x;
             }
        }
        function calculate(equation) {
             var answer = eval(equation);
             document.getElementById('screen').value = answer;
        }

        </script>
        </head>

        <body>
        <table class="calc" cellpadding=4>
        <tr><td colspan=3><input class="calc" id="screen" value='0'type="text"></td></tr>
        <tr>
        <td><input class="calc" type="button" value=1 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=2 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=3 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='/' onclick="pushButton(this.value);"></td>
        </tr>
        <tr>
        <td><input class="calc" type="button" value=4 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=5 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=6 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='*' onclick="pushButton(this.value);"></td>
        </tr>
        <tr>
        <td><input class="calc" type="button" value=7 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=8 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value=9 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='-' onclick="pushButton(this.value);"></td>
        </tr>
        <tr>
        <td><input class="calc" type="button" value=0 onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='.' onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='C' onclick="pushButton(this.value);"></td>
        <td><input class="calc" type="button" value='+' onclick="pushButton(this.value);"></td>
        </tr>
        <tr><td colspan=3><input class="calc" type="button" value='=' onclick="calculate(document.getElementById('screen').value);"></td></tr>
        </table>

        </body>
        </html

これは、ページをクリアすると0が表示されることを除いて、あなたが望むことを行います。それらを一緒に追加する前に、値をintにするようにしました。

于 2012-05-22T19:12:19.320 に答える