js 计算器

最新推荐文章于 2024-08-11 01:47:13 发布

奋斗的小小骚年

最新推荐文章于 2024-08-11 01:47:13 发布

阅读量141

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_41654985/article/details/79773172

版权

JavaScript 专栏收录该内容

33 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        input{
            height: 100px;
            width: 500px;
            background-color: dodgerblue;
            text-align: center;
        }
        select{
            height: 106px;
        }
    </style>
</head>
<body>
<input type="text" id="numOne">
<select id="typeSelect">
    <option>+</option>
    <option>-</option>
    <option>*</option>
    <option>/</option>
</select>
<input type="text" id="numTwo">
=
<input type="text" id="sumTxt">
<button id="bn">计算</button>
<script>
    /*
    *  根据id获取标签 document.getElementById("id")
    *  获取下拉菜单选择的索引值 下拉菜单.selectedIndex
    *  input 文本框的内容   文本框.value
    * */
    /*    console.log(typeSelect.selectedIndex);
  console.log(numOne.value);
  sumTxt.value="10";*/
    var numOne=document.getElementById("numOne");
    var numTwo=document.getElementById("numTwo");
    var sumTxt=document.getElementById("sumTxt");
    var typeSelect=document.getElementById("typeSelect");
    var bn=document.getElementById("bn");
    //        当点击按钮时执行里面的语句
    bn.addEventListener("click",clickHandler);
    function clickHandler(e) {
        e = e || window.event;
        //点击后执行这里
//                判断语句和最后内容填入sumText都写在这里。。。。
        numOne1 = Number(numOne.value);
        numTwo2 = Number(numTwo.value);

        /*console.log(typeSelect.selectedIndex);
    console.log(numOne.value);
    console.log(numTwo.value);*/
        if (isNaN(numOne1) || isNaN(numTwo2) || (numTwo2 === 0 && typeSelect.selectedIndex === 3)) {
            console.log("输入的数值有误");
        } else {
            if (typeSelect.selectedIndex === 0) {
                sumTxt.value = numOne1+ numTwo2;
            }
            if (typeSelect.selectedIndex === 1) {
                sumTxt.value = numOne1 - numTwo2;
            }
            if (typeSelect.selectedIndex === 2) {
                sumTxt.value = numOne1* numTwo2;
            }
            if (typeSelect.selectedIndex === 3) {
                sumTxt.value = numOne1 / numTwo2;
            }

        }
    }

</script>
</body>
</html>