js实现简易计算器

最新推荐文章于 2024-10-05 15:23:36 发布

仔蛋

最新推荐文章于 2024-10-05 15:23:36 发布

阅读量66

点赞数

文章标签： html5 css html

本文链接：https://blog.csdn.net/LuoZaiZ/article/details/120481412

版权

//计算器的布局
       <div id="d1">
           <input type="text" name="" id="show" value="" />
           <button type="button" id="clear">clear</button>
           <br>

           <input type="button" name="" id="" value="1" />
           <input type="button" name="" id="" value="2" />
           <input type="button" name="" id="" value="3" />
           <input type="button" name="" id="" value="+" />
           <br>
           <input type="button" name="" id="" value="4" />
           <input type="button" name="" id="" value="5" />
           <input type="button" name="" id="" value="6" />
           <input type="button" name="" id="" value="-" />
           <br>
           <input type="button" name="" id="" value="7" />
           <input type="button" name="" id="" value="8" />
           <input type="button" name="" id="" value="9" />
           <input type="button" name="" id="" value="*" />
           <br>
           <input type="button" name="" id="" value="0" />
           <input type="button" name="" id="" value="." />
           <button type="button" id="result">=</button>
           <input type="button" name="" id="" value="/" />

           <br>

       </div>
       <script type="text/javascript">

//加法的运算事件
           $("[type=button]").click(function(){
               var num=$(this).val();
               var str=$("#show").val();
               $("#show").val(str+num);
           })

//减，乘，除的运算。eval(运算公式) 可以自己分辨，运算。
           $("#result").click(function(){
               var strr=$("#show").val();
               var result=eval(strr).toFixed(2)
               $("#show").val(result);
           })
           $("#clear").click(function(){
               var clear="";
               $("#show").val(clear);
           })
       </script>