計算機で小数点をつけた後に0を2回表示する方法

計算機を作成したのですが、小数点をつけた後に0.00と表示させる事が出来ません。それ以外は問題なく動くのですが、どこのコードを修正すべきなのか御指導を宜しくお願いします。

該当のソースコード

``JavaScript

ソースコード

<html>
<title>励ましてくれる電卓
    
</title>

<head>
    <meta charset="UTF-8">
    <style>
        #contena {
            width: 300px;
            height: 400px;
            background-color: #d0d0d0;
            border: 1px solid;
            margin-left: auto;
            margin-right: auto;
            margin-top: 100px;
        }

        button {
            display: block;
            width: 100%;
            height: 100%;
            font-size: 20px;
            background-color: #d0d0d0;
            margin: 0 0 0 0;
            padding: 0 0 0 0;
        }

        #result_display {
            display: block;
            width: 98%;
            height: 90%;
            text-align: right;
            font-size: 30px;
            background-color: #000000;
            color: #ffffff;
        }

        td {
            width: 80px;
            padding: 0 0 0 0;
            margin: 0 0 0 0;
        }

        .other {
            background-color: #ffa400;
        }
    </style>
</head>

<body>

    <table id="contena">
        <tr>
            <td colspan="4">
                <div id="result_display">0</div>
            </td>
        </tr>
        <tr>
            <td>
                <button onclick="hyoji(1)">1</td>
            <td>
                <button onclick="hyoji(2)">2</td>
            <td>
                <button onclick="hyoji(3)">3</td>
            <td>
                <button class="other" onclick="calculation(this,'+')">+</td>
        </tr>
        <tr>
            <td>
                <button onclick="hyoji(4)">4</td>
            </td>
            <td>
                <button onclick="hyoji(5)">5</td>
            </td>
            <td>
                <button onclick="hyoji(6)">6</td>
            </td>
            <td>
                <button class="other" onclick="calculation(this,'-')">－</td>
        </tr>
        <tr>
            <td>
                <button onclick="hyoji(7)">7</td>
            <td>
                <button onclick="hyoji(8)">8</td>
            <td>
                <button onclick="hyoji(9)">9</td>
            <td>
                <button class="other" onclick="calculation(this,'*')">×</td>
        </tr>
        <tr>
            <td>
                <button onclick="hyoji(0)">0</td>
            <td>
                <button onclick="hyoji('.')">.</td>
            <td>
                <button onclick="calculation(this,'π')">π</td>
            <td>
                <button class="other" onclick="calculation(this,'/')">÷</td>
        </tr>
        <tr>
            <td>
                <button onclick="meigen(1)">社</td>
            <td>
                <button onclick="meigen(2)">筋</td>
            <td>
                <button onclick="cleardis()">C</td>
            <td>
                <button class="other" onclick="equal()">＝ </td>
        </tr>
    </table>
    <script>
        "use strict";
        let result_display = document.getElementById('result_display');//結果の表示欄
        let input_display = 0;//入力した数字をいったん表示
        let Number_Storage = 0;//入力した数値の格納場所
        let result_Storage = 0;//演算が終わった後の結果の数値を格納
        let dotflag = 0;//ドットを押した時のフラグ。初期値は0
        let flag = 0;//前回クリックした要素を判断。初期値と数字なら０
        var Pi =Math.PI;

        function text(num) {//前回が数字を押した際の関数
            input_display = input_display + num + '';//数値をテキスト化表示
            result_display.innerHTML = Number(input_display);//結果を数値化して表示
        }

        function cal(display, ope) {//前回押したフラグを判断してresult_Storageに格納する関数
            if (flag == '+') {
                result_Storage = result_Storage + Number_Storage;
            } else if (flag == '-') {
                result_Storage = result_Storage - Number_Storage;
            } else if (flag == '*') {
                result_Storage = result_Storage * Number_Storage;
            } else if (flag == '/') {
                result_Storage = result_Storage / Number_Storage;
            }else if (flag == 'π') {
                result_Storage = result_Storage * Pi  ;
            }

        }
        function cleardisplay() {
            input_display = "0";
            result_Storage = 0;
            Number_Storage = "0";
            flag = 0;
            dotflag = 0;
        }

        //ここまで関数宣言


        function hyoji(num) {//数字をクリックした時の条件分岐
            if (flag == 0) {//前回数字か初期
                text(num);
                result_Storage = Number(input_display);
            } else {//前回が演算子の場合
                text(num);
                Number_Storage = Number(input_display);
            }
        }



        function dot() {//ドットを押した時の関数
            if (dotflag == 0) {//ドットを押していない
                text(num);
                dotflag = 1;
                flag = 0;
            }
        }



        function calculation(display, ope) {//演算子をクリックした場合の関数→for文にすればよかった・・
            if (ope == '+') {//現在押した演算子が足し算の場合
                cal(display, ope);

            } else if (ope == '-') {//現在押した演算子が引き算の場合
                cal(display, ope);

            } else if (ope == '*') {//現在押した演算子が掛け算の場合
                cal(display, ope);
            } else if (ope == '/') {
                cal(display, ope);
            }else if (ope == 'π') {
                cal(display);
                
            }
            result_display.innerHTML = display.innerText;//クリックした演算子を表示
            input_display = "";//表示の記録をリセット
            flag = ope;
        }



        function equal() {
            cal();
            result_display.innerHTML = result_Storage;
            cleardisplay();
        }


        function cleardis() {
            console.log("ji");
            cleardisplay();
            result_display.innerHTML = Number(0);
        }


 function meigen(meigen) {//すばらしい言葉を見たい場合
            if (meigen == 1) {
                result_display.innerHTML = "頑張ったら給料上げる";
            } else if (meigen == 2) {
                result_display.innerHTML = "筋肉は裏切らない";
            }
        }
 </script>
</body>

</html>
         


### 試したこと
結果表示を数値からテキストに変えてみたりしたのですが、そうすると小数点打たない状態で000と入力できてしまうので諦めました


### 補足情報（FW/ツールのバージョンなど）
chrome、IEで動作確認済み

noka_blank

2019/01/25 00:09

markdown形式が崩れているので、修正お願いできますでしょうか？

行動規範の内容に同意します

回答2件

javascript
1function text(num) {//前回が数字を押した際の関数
2input_display = input_display + num + '';//数値をテキスト化表示
3//result_display.innerHTML = Number(input_display);//結果を数値化して表示
4result_display.innerHTML = input_display;//結果を数値化して表示しちゃだめ。0.00は数値にしたら0になる
5}

投稿2019/01/25 01:08

編集2019/01/25 01:15

papinianus

総合スコア12705

読み難いのでコードは見てませんが、既にテキストで持っているのであれば↓のようにすることもできます。

function Format(text)
{
    var array = text.split("."); // 小数点で分割
    array[0] = array[0] - 0 + ""; // 整数部を数値にしてから文字列に戻す(頭の0を削除)
    return array.join("."); // 小数点を戻す
}

function SomeFunction()
{
    ormat("000"); // "0"
    ret = Format("000.00"); // "0.00"
}

テキスト管理だと"."の複数回入力等面倒なチェックが必要になる気がするので他の方法でやったほうがいいと思いますが、参考までに。

投稿2019/01/25 00:46