简易的加减乘除的计算器代码js

JavaScript027

简易的加减乘除的计算器代码js,第1张

//html

<input type="text" id="num1" value="" />

    <select id="mySelect">

        <option value="+">+</option>

        <option value="-">-</option>

        <option value="*">*</option>

        <option value="/">/</option>

    </select>

    <input type="text" id="num2" value="" />

    <input type="button" id="jisuan" value="计算" />

//js

<script>

    var oTxt1 = document.getElementById('num1')

    var oTxt2 = document.getElementById('num2')

    var oSelect = document.getElementById('mySelect')

    var oBtn = document.getElementById('jisuan')

    oBtn.onclick=function(){

        switch(oSelect.value){

            case '+':

                alert(parseInt(oTxt1.value)+parseInt(oTxt2.value))

                break

            case '-':

                alert(parseInt(oTxt1.value)-parseInt(oTxt2.value))

                break

            case '*':

                alert(parseInt(oTxt1.value)*parseInt(oTxt2.value))

                break

            case '/':

                if(parseInt(oTxt2.value) !== 0){

                    alert(parseInt(oTxt1.value)/parseInt(oTxt2.value))

                }else{

                    alert('除数不能为0')

                }

                

                break

            default:

                alert('Bug!!!')

        }

    }

</script>

直接上代码，运行函数会返回一个数组，参数number是你要生成的题目总数，至少要大于等于1，flag是你要生成几位加减乘除运算式，至少要大于等于2.

function randCalc(number, flag) {

var flags = ['+', '-', '*', '/']

var list = []

var M = 100

if(flag <2 || number <1) return

function getFlag() {

return flags[Math.random()*flags.length | 0]

}

function getNumber() {

return Math.random() * M | 0

}

while(number--) {

var tmp = getNumber()

var n = flag - 1

while(n--) {

tmp += getFlag() + getNumber()

}

list.push(tmp)

}

return list

}

randCalc(10, 2)//生成了10道，2位运算题

randCalc(10,4)//生成了10道，4位运算题

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title></title>

</head>

<body>

<table>

<tr>

<td><input type="button" value="add" onclick="setOp('+', 'add')"/></td>

<td><input type="button" value="miner" onclick="setOp('-', 'miner')"/></td>

<td><input type="button" value="times" onclick="setOp('*', 'times')"/></td>

<td><input type="button" value="divide" onclick="setOp('/', 'divide')"/></td>

</tr>

</table>

<table id="tb_calc" style="display:none">

<tr>

<td><input id="x" type="text" style="width:100px" value="" name="x" /></td>

<td><lable id="op" name="op"></lable></td>

<td><input id="y" type="text" style="width:100px" value="" name="y" /></td>

<td><input id="opTips" type="button" value="" onclick="calc()"/></td>

<td><lable id="z" name="z"></lable></td>

</tr>

</table>

<script type="application/javascript">

function setOp(op, opTips)

{

var tb=document.getElementById("tb_calc")

tb.style.display = "none"

document.getElementById("x").value = ""

document.getElementById("y").value = ""

document.getElementById("z").innerText = ""

document.getElementById("op").innerText = op

document.getElementById("opTips").value = opTips

tb.style.display = "block"

}

function calc()

{

var x = parseInt(document.getElementById("x").value)

var y = parseInt(document.getElementById("y").value)

var op = document.getElementById("op").innerText

var z = ""

switch(op)

{

case '+':

z = x + y

break

case '-':

z = x - y

break

case '*':

z = x * y

break

case '/':

z = x / y

break

default:

z = ''

}

console.log(x, op, y, '=', z)

document.getElementById("z").innerText = z

}

</script>

</body>

</html>