美文网首页
JavaScript计算器

JavaScript计算器

作者: qianxun0921 | 来源:发表于2018-09-26 09:36 被阅读0次

    body代码如下:

    <body>
        
        <h1>计算器</h1>
        <input type="text" name="" id="input01">
        <select id="select">
            <option value="+">+</option>
            <option value="-">-</option>
            <option value="*">*</option>
            <option value="/">/</option>
        </select>
        <input type="text" name="" id="input02">
        <input type="button" value="=" onclick="count()">
        <input type="text" id = "text">
    </body>
    

    JavaScript代码如下:

    <script type="text/javascript">
            function count(){ //获取第一个输入框的值 
            var a=+(document.getElementById('input01').value); 
            //获取第一个输入框的值 
            var b=document.getElementById('select').value; 
            //获取第二个输入框的 
            var c=+(document.getElementById('input02').value); 
            result='' ;
            switch(b){ 
                case'+': 
                    result=a+c; 
                    break; 
                case'-': 
                    result=a-c; 
                    break; 
                case'*': 
                    result=a*c; 
                    break; 
                case'/': 
                    result=a/b; 
                    break 
                    } 
                    // 输出结果 
                    document.getElementById('text').value=result; }
        </script>
    

    实现效果如下:

    img.png

    相关文章

      网友评论

          本文标题:JavaScript计算器

          本文链接:https://www.haomeiwen.com/subject/avtdoftx.html