天天看點

實作電腦功能

具體要求如下:

實作電腦功能

實作代碼:

<html>
    <head>
        <meta charset="utf-8">
        <title>電腦</title>
        <script>
            function myck(type){
                var num1 = document.getElementById("num1");
                var num2 = document.getElementById("num2");
                if(type==1){
                    // 計算操作
                    var result = parseInt(num1.value) + parseInt(num2.value);
                    alert(result);
                    document.getElementById("resultDiv").innerText ="最終計算結果:"+ result;
                }else if(type==2){
						  var result = parseInt(num1.value) - parseInt(num2.value);
                          alert(result);
                          document.getElementById("resultDiv").innerText ="最終計算結果:"+ result;
						}
					    else if(type==3){
								 var result = parseInt(num1.value) * parseInt(num2.value);
								 alert(result);
								 document.getElementById("resultDiv").innerText ="最終計算結果:"+ result;
						      }
				              else if(type==4){
								       if(confirm("是否正确清空?")){
								       // 清空
								       num1.value = "";
								       num2.value = "";
								       document.getElementById("resultDiv").innerText="";
								   }
                      }
            }
        </script>
    </head>
    <body>
        <div style="margin-top: 100px;margin-left: 500px;">
           <span style="font-size: 60px;">電腦</span>     
        </div>
        <div>
            <div class="innerDiv" style="margin-left: 490px;">
                數&nbsp;&nbsp;字1:<input id="num1" type="number" placeholder="請輸入數字1"> 
            </div>
        </div>
        <div>
           <div class="innerDiv" style="margin-left:490px;">
            數&nbsp;&nbsp;字2:<input id="num2" type="number" placeholder="請輸入數字2">
          </div>  
        </div>
        <div>
           <div style="margin-left: 500px;" class="innerDiv">
                <input type="button" onclick="myck(1)" value="相&nbsp;&nbsp;加">
			    <input type="button" onclick="myck(2)" value="相&nbsp;&nbsp;減">
			    <input type="button" onclick="myck(3)" value="相&nbsp;&nbsp;乘">
                <input type="button" onclick="myck(4)" value="清&nbsp;&nbsp;空">
           </div> 
        </div>
        <div id="resultDiv">

        </div>
    </body>
    <style>
        .innerDiv{
            margin-left: 420px;
            margin-top: 20px;
        }
    </style>
</html>
           

繼續閱讀