anonymous No title
No License HTML
2020年10月17日
Copy
<!DOCTYPE html>
<html lang="ja">
<head>
    <link rel="stylesheet" href="kadai5_5_2.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="tel">
        <h1>電卓</h1>
        <input id="show_input" type="text" class="show_input">
        <input id="delete" onclick="delete_num()" type="button" class="delete" value="×"><br/>
        <input id="7" onclick="input_num(document.getElementById('7').value)" type="button" class="num" value="7">
        <input id="8" onclick="input_num(document.getElementById('8').value)" type="button" class="num" value="8">
        <input id="9" onclick="input_num(document.getElementById('9').value)" type="button" class="num" value="9">
        <input id="×" onclick="input_num(document.getElementById('×').value)" type="button" class="num" value="*"><br/>
        <input id="4" onclick="input_num(document.getElementById('4').value)" type="button" class="num" value="4">
        <input id="5" onclick="input_num(document.getElementById('5').value)" type="button" class="num" value="5">
        <input id="6" onclick="input_num(document.getElementById('6').value)" type="button" class="num" value="6">
        <input id="-" onclick="input_num(document.getElementById('-').value)" type="button" class="num" value="-"><br/>
        <input id="1" onclick="input_num(document.getElementById('1').value)" type="button" class="num" value="1">
        <input id="2" onclick="input_num(document.getElementById('2').value)" type="button" class="num" value="2">
        <input id="3" onclick="input_num(document.getElementById('3').value)" type="button" class="num" value="3">
        <input id="+" onclick="input_num(document.getElementById('+').value)" type="button" class="num" value="+"><br/>
        <input id="0" onclick="input_num(document.getElementById('0').value)" type="button" class="big_num" value="0">
        <input id="=" onclick="calc()" type="button" class="num" value="=">
        <input id="÷" onclick="input_num(document.getElementById('÷').value)" type="button" class="num" value="/"><br/>
    </div>
    <script>
        var result = document.getElementById("show_input");
        function input_num(x){
            document.getElementById("show_input").value=document.getElementById("show_input").value+x;
        }
        function delete_num(){
            document.getElementById("show_input").value="";
        }
        function calc() {
            result.value = new Function("return " + result.value)();
        }
    </script>
</body>
</html>
<!DOCTYPE html>
<html lang="ja">
<head>
    <link rel="stylesheet" href="kadai5_5_2.css">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="tel">
        <h1>電卓</h1>
        <input id="show_input" type="text" class="show_input">
        <input id="delete" onclick="delete_num()" type="button" class="delete" value="×"><br/>
        <input id="7" onclick="input_num(document.getElementById('7').value)" type="button" class="num" value="7">
        <input id="8" onclick="input_num(document.getElementById('8').value)" type="button" class="num" value="8">
        <input id="9" onclick="input_num(document.getElementById('9').value)" type="button" class="num" value="9">
        <input id="×" onclick="input_num(document.getElementById('×').value)" type="button" class="num" value="*"><br/>
        <input id="4" onclick="input_num(document.getElementById('4').value)" type="button" class="num" value="4">
        <input id="5" onclick="input_num(document.getElementById('5').value)" type="button" class="num" value="5">
        <input id="6" onclick="input_num(document.getElementById('6').value)" type="button" class="num" value="6">
        <input id="-" onclick="input_num(document.getElementById('-').value)" type="button" class="num" value="-"><br/>
        <input id="1" onclick="input_num(document.getElementById('1').value)" type="button" class="num" value="1">
        <input id="2" onclick="input_num(document.getElementById('2').value)" type="button" class="num" value="2">
        <input id="3" onclick="input_num(document.getElementById('3').value)" type="button" class="num" value="3">
        <input id="+" onclick="input_num(document.getElementById('+').value)" type="button" class="num" value="+"><br/>
        <input id="0" onclick="input_num(document.getElementById('0').value)" type="button" class="big_num" value="0">
        <input id="=" onclick="calc()" type="button" class="num" value="=">
        <input id="÷" onclick="input_num(document.getElementById('÷').value)" type="button" class="num" value="/"><br/>
    </div>
    <script>
        var result = document.getElementById("show_input");
        function input_num(x){
            document.getElementById("show_input").value=document.getElementById("show_input").value+x;
        }
        function delete_num(){
            document.getElementById("show_input").value="";
        }
        function calc() {
            result.value = new Function("return " + result.value)();
        }
    </script>
</body>
</html>

No one still commented. Please first comment.