zoukankan      html  css  js  c++  java
  • 9.JavaScript简单计算器的实现

    1.难点,怎么获取标签的值,注意点,获取到的值都是string类型,还要转换

    var num1 = parseInt(document.getElementById("num1").value);
    var num2 = parseInt(document.getElementById("num2").value);

    2.怎么获取select下拉菜单下的值。。

    //这里说我自己百度来的。。

    var tag = document.getElementById("myselect");
    // alert(tag);
    // 获取标签的值
    var opeartor = tag.options[tag.selectedIndex].value;

    实现代码:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>计算器实现</title>
        <script type="text/javascript">
            function opera() {
                var num1 = parseInt(document.getElementById("num1").value);
                var num2 = parseInt(document.getElementById("num2").value);
                var tag = document.getElementById("myselect");
                // alert(tag);
                // 获取标签的值
                var opeartor = tag.options[tag.selectedIndex].value;
                // alert(opeartor);
             //     alert(num1);
                // alert(num2);
                // 声明变量存储值
                var result = 0;
                switch(opeartor) {
                    case "+":
                        result = num1 + num2;
                        // alert('test');
                        break;
                    case "-":
                        result = num1 - num2;
                        // alert('msg');
                        break;
                    case "*":
                        result = num1 * num2;
                        break;
                    case "/":
                        result = num1 / num2;
                        break;
                }
                // alert(result);
                // alert('msg');
           // 将值赋给id="result"的标签 document.getElementById("result").value = result; } </script> </head> <body> <h1>计算器实现</h1> <input type="text" id="num1" /> <select id="myselect"> <option value="+" id="+">+</option> <option value="-" id="-">-</option> <option value="*" id="*">*</option> <option value="/" id="/">/</option> </select> <input type="text" id="num2" /> = <input type="text" id="result" onclick="opera()"> </body> </html>
  • 相关阅读:
    众多linux 库及工具意思的解释
    ubuntu root 登录
    Oscillator的参数解释
    世界观和方法论写给学弟学妹的
    元件的降额使用可靠度设计
    电子元件又一话——电感篇
    【转】什么是磁珠(Ferrite Bead 即 FB)
    Digital System Design Guidelines
    几种典型接口的电平标准
    珀耳帖效应
  • 原文地址:https://www.cnblogs.com/tumio/p/4544667.html
Copyright © 2011-2022 走看看