使用JS做簡單的四則運算的計算器
阿新 • • 發佈：2019-02-04
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
function ss() {
var text1=document.getElementById("text1").value;
var obj=document.getElementById("gs");
var index = obj.selectedIndex;
var sushu = obj.options[index].value;
//獲取下拉框的值
*/
var sushu = document.getElementById("gs").value; //獲取下拉框的值
var text3 = document.getElementById("text3");
var rst;
num1 = parseFloat(text1);
num2 = parseFloat(text2);
switch(sushu){
case "+":
rst = num1+num2; break;
case "-":
rst = num1-num2; break;
case "*":
rst = num1*num2; break;
case "/":
rst = num1/num2; break;
}
text3.value=rst; //將得到的值交給第三個下拉框，注意一點：如果上面給text3賦值時直接使用.value,這裡給text3賦值是無法傳入文字框的。
}
</script>
</head>
<body>
<p><input id="text1" type="text" name="text1" size="5px"/>
<select id="gs" name="gs">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input id="text2" type="text" name="text2" size="5px" />
<input type="button" name="equal" value="=" onclick="ss();"/>
<input type="text" id="text3" size="5px" readonly/>
</p>
</body>
</html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
function ss() {
var text1=document.getElementById("text1").value;
var text2=document.getElementById("text2").value;
//下面有兩個獲取下拉框的值方法，第一個是我自己在網上查的，第二個是老師上課講的方法
var obj=document.getElementById("gs");
var index = obj.selectedIndex;
var sushu = obj.options[index].value;
//獲取下拉框的值
*/
var sushu = document.getElementById("gs").value; //獲取下拉框的值
var text3 = document.getElementById("text3");
var rst;
num1 = parseFloat(text1);
num2 = parseFloat(text2);
switch(sushu){
case "+":
rst = num1+num2; break;
case "-":
rst = num1-num2; break;
case "*":
rst = num1*num2; break;
case "/":
rst = num1/num2; break;
}
text3.value=rst; //將得到的值交給第三個下拉框，注意一點：如果上面給text3賦值時直接使用.value,這裡給text3賦值是無法傳入文字框的。
}
</script>
</head>
<body>
<p><input id="text1" type="text" name="text1" size="5px"/>
<select id="gs" name="gs">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input id="text2" type="text" name="text2" size="5px" />
<input type="button" name="equal" value="=" onclick="ss();"/>
<input type="text" id="text3" size="5px" readonly/>
</p>
</body>
</html>