HTML和JS实现简单的计算器

互联网 18-3-5

HTML和JS实现计算器功能的也是很容易的，本文主要和大家分享HTML和JS实现简单的计算器，希望能帮助到大家。

下面是代码：

   <!doctype html>  <html>  <head>  <meta charset="utf-8">  <title>无标题文档</title>  <link rel="stylesheet" type="text/css" href="untitled.css">  </head>  <script type="text/javascript">           var result="";            function jisuan(num){        if(num=="="){    document.form1.text.value=eval(result);    }else{    result=result+num;    document.form1.text.value=result;    }    }  </script>  <body>  <p class="box">  <form action="" class="form1" name="form1">        <p class="header">            <input type="text" id="text" name="text" class="text"/>                      </p>            <p class="nav">       <table class="table">           <tr>           <td>  <input id="1" style="height:55px; width:55px;" type="button" value="1" onClick="jisuan(this.id)"/> </td>           <td>  <input id="2" style="height:55px; width:55px;" type="button" value="2" onClick="jisuan(this.id)"/> </td>           <td>  <input id="3" style="height:55px; width:55px;" type="button" value="3" onClick="jisuan(this.id)"/> </td>           <td>  <input id="+" style="height:55px; width:55px;" type="button" value="+" onClick="jisuan(this.id)"/> </td>           </tr>           <tr>           <td>  <input id="4" style="height:55px; width:55px;" type="button" value="4" onClick="jisuan(this.id)"/> </td>           <td>  <input id="5" style="height:55px; width:55px;" type="button" value="5" onClick="jisuan(this.id)"/> </td>           <td>  <input id="6" style="height:55px; width:55px;" type="button" value="6" onClick="jisuan(this.id)"/> </td>            <td>  <input id="-" style="height:55px; width:55px;" type="button" value="-" onClick="jisuan(this.id)"/> </td>           </tr>           <tr>           <td>  <input id="7" style="height:55px; width:55px;" type="button" value="7" onClick="jisuan(this.id)"/> </td>           <td>  <input id="8" style="height:55px; width:55px;" type="button" value="8" onClick="jisuan(this.id)"/> </td>           <td>  <input id="9" style="height:55px; width:55px;" type="button" value="9" onClick="jisuan(this.id)"/> </td>            <td>  <input id="*" style="height:55px; width:55px;" type="button" value="*" onClick="jisuan(this.id)"/> </td>           </tr>            <tr>           <td>  <input id="/" style="height:55px; width:55px;" type="button" value="/" onClick="jisuan(this.id)"/> </td>           <td>  <input id="0" style="height:55px; width:55px;" type="button" value="0" onClick="jisuan(this.id)"/> </td>            <td>  <input id="." style="height:55px; width:55px;" type="button" value="." onClick="jisuan(this.id)"/></td>            <td>  <input id="=" style="height:55px; width:55px;" type="button" value="=" onClick="jisuan(this.id)"/> </td>           </tr>           </table>                            </p>     </form>   </p>  </body>  </html>

相关推荐：HTML怎样实现简单计算器

js实现简单四则运算计算器功能

JS实现的简单四则运算计算器功能示例

以上就是HTML和JS实现简单的计算器的详细内容，更多内容请关注技术你好其它相关文章！

来源链接：

免责声明：
1.资讯内容不构成投资建议，投资者应独立决策并自行承担风险
2.本文版权归属原作所有，仅代表作者本人观点，不代表本站的观点或立场

标签：计算器