javascipt實現網頁版的計算器

文章目錄


看了兩天JavaScript感覺還是挺有意思的,寫了代碼,存爲html格式,用瀏覽器打開就可以看到結果,即時的反饋激勵給人帶來快樂。現在根據入門知識寫一個可以計算小數的計算器。代碼如下:

<!DOCTYPE html>
<html>
 <head>
  <title> 事件</title>  
  <script type="text/javascript">
   function count()
   {      
    //獲取第一個輸入框的值
	//獲取第二個輸入框的值
	//獲取選擇框的值
	//獲取通過下拉框來選擇的值來改變加減乘除的運算法則
    //設置結果輸入框的值 
        var num1=parseFloat(document.getElementById("txt1").value);
        
        var num2=parseFloat(document.getElementById("txt2").value);
        if (num1=="" || isNaN(num1)||num2=="" || isNaN(num2))
        {
            alert("請填寫數字");
        }
        var op=document.getElementById("select").value;
        var result;
        switch (op)
        {
            case "+":
            result= num1+num2;
            break;
            case "-":
            result=num1-num2;
            break;
            case "*":
            result=num1*num2;
            break;
            case "/":
            result=num1/num2;
            break
        }
        document.getElementById('fruit').value=result;      
      
   }
  </script> 
 </head> 
 <body>
   <input type='text' id='txt1' /> 
   <select id='select'>
		<option value='+'>+</option>
		<option value="-">-</option>
		<option value="*">*</option>
		<option value="/">/</option>
   </select>
   <input type='text' id='txt2' /> 
   <input type='button' value=' = '  onclick="count()"/> <!--通過 = 按鈕來調用創建的函數,得到結果--> 
   <input type='text' id='fruit' />   
 </body>
</html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章