                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /JavaScript進階篇

供各位參考，代碼中有對應的注釋。

<!DOCTYPE?html>
<html>?
<head>??
<title>?事件</title>????
<script?type="text/javascript">???
function?count(){????
//獲取第一個輸入框的值????
var?num1=document.getElementById("txt1").value;????
//獲取第二個輸入框的值????
var?num2=document.getElementById("txt2").value;????
//獲取選擇框的值????
var?calc=document.getElementById("select").value;????
//用于存放計算結果，這里先初始化????result=null;????
//用switch語句區(qū)分符合，對應計算方式????
switch(calc){????????
case?"+":???????????
/*?parseFloat()是把document.getElementById().value????????????
中得到得String（字符型）值轉換為FLoat（浮點）值*/????????????
result=parseFloat(num1)+parseFloat(num2);????????????
break;????????
case?"-":????????????
result=parseFloat(num1)-parseFloat(num2);????????????
break;????????
case?"*":????????????
result=parseFloat(num1)*parseFloat(num2);????????????
break;????????
case?"/":????????????
result=parseFloat(num1)/parseFloat(num2);????????
}????
//把上面switch語句得到得結果賦予id為fruit的text框中????
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()"/>????
<!--通過?=?按鈕來調用創(chuàng)建的函數(shù)，得到結果-->????
<input?type='text'?id='fruit'?/>????
</body>
</html>