一個(gè)簡(jiǎn)單易懂的做法
<!DOCTYPE html>
<html>
? <head>
??? <title>事件</title>
??? <script type="text/javascript">
????? function count() {
??????? //獲取第一個(gè)輸入框的值
??????? var a = document.getElementById("txt1").value - 0;
??????? //獲取第二個(gè)輸入框的值
??????? var b = document.getElementById("txt2").value - 0;
??????? //獲取選擇框的值
??????? var c = document.getElementById("select");
??????? var fruit = document.getElementById("fruit");
??????? //獲取通過下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則
??????? switch (c.value) {
????????? case "+":
??????????? fruit.value = a + b;
??????????? break;
????????? case "-":
??????????? fruit.value = a - b;
??????????? break;
????????? case "*":
??????????? fruit.value = a * b;
??????????? break;
????????? case "/":
??????????? fruit.value = a / b;
??????????? break;
??????? }
??????? //設(shè)置結(jié)果輸入框的值
????? }
??? </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()" />
??? <!--通過 = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù)，得到結(jié)果-->
??? <input type="text" id="fruit" />
? </body>
</html>
2022-01-21
<!DOCTYPE?html><html>?<head>??<title>?事件</title>????<script?type="text/javascript">???function?count(){????var?a?=?document.getElementById('txt1').value;???????//獲取第一個(gè)輸入框的值????var?b?=?document.getElementById('txt2').value; //獲取第二個(gè)輸入框的值 var?f?=?document.getElementById('select').value;? //獲取選擇框的值 //獲取通過下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則????//設(shè)置結(jié)果輸入框的值?????document.getElementById('fruit').value?=?eval(a?+?f?+?b);???}??</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()"?/>?<!--通過?=?按鈕來(lái)調(diào)用創(chuàng)建的函數(shù)，得到結(jié)果-->????<input?type='text'?id='fruit'?/>????</body></html>2021-04-06
<!DOCTYPE html>
<html>
<head>
<title> 事件 </title>? ?
<script type = "text/javascript" >
function count() {
var a = document.getElementById("txt1").value;
var b = document.getElementById("txt2").value;
var sum = 0;
//獲取第一個(gè)輸入框的值
//獲取第二個(gè)輸入框的值
//獲取選擇框的值
var c = document.getElementById("select").value;
//獲取通過下拉框來(lái)選擇的值來(lái)改變加減乘除的運(yùn)算法則
switch(c) {
case "+":
sum = parseInt(a)+ parseInt(b);
break;
case "-":
sum = parseInt(a) - parseInt(b);
break;
case "*":
? ? sum = parseInt(a) * parseInt(b);
? ? break;
case "/":
? ? sum =parseInt(a) / parseInt(b);
? ? break;
}
document.getElementById("fruit").value=sum;
}
</script>
</head>?
<body>
<input type = 'text'id = 'txt1' / >
<select id = 'select' onchange="count()">
<option value = '+' > + < /option>?
<option value = "-" > - < /option>
<option value = "*" > * < /option>?
<option value = "/" > /</option >
</select>
<input type = 'text'id = 'txt2' / >
<input type = 'button'value = ' = 'onclick="count()" / >?
<!--通過 = 按鈕來(lái)調(diào)用創(chuàng)建的函數(shù)，得到結(jié)果-->
<input type = 'text'id = 'fruit' / >
</body>?
</html>
2021-04-02
為什么-0就變成number類型了
2021-01-25
var?fruit?=?document.getElementById("fruit");提前賦值，是挺好的，省了一些代碼
var?b?=?document.getElementById("txt2").value?-?0;隱式轉(zhuǎn)換為數(shù)字也很巧妙啊