幻之律 发表于 2022-12-20 08:58

求补全代码(网页类),简易计算器

本帖最后由 幻之律 于 2022-12-20 09:07 编辑

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title></title>
                <styletype="text/css">
                          table
                          {
                          border-collapse:collapse;
                                background-color:#a6a6d4;
                                width:500px;
                           }
                   .result
                           {
                             border:solid 1px #999999;
                               color:#FF0033;
                               font-family:Arial, Helvetica, sans-serif;
                               font-size:16px;
                               height:25px;
                           }
                </style>
                <script type="text/javascript">
                        function add()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                        document.getElementById("txtResult").value=1234;
                        }
       
                       
                </script>
        </head>
        <body>
                <form name="myform">
                <table border="0" align="center" cellpadding="0" cellspacing="0">
                        <tr>
                            <td height="28" colspan="2" align="left" bgcolor="#1191FF" ></td>   
                        </tr>
                        <tr>
                            <td height="43" colspan="2" align="center" bgcolor="#1191FF" > <h2>简易计算器</h2></td>   
                        </tr>
                        <tr>
                            <td height="35" align="right">数值1:</td>
                            <td><input id="txtNum1" type="text" /></td>
                        </tr>
                        <tr>
                            <tdheight="35" align="right">数值2:</td>
                            <td><input id="txtNum2" type="text" /></td>
                        </tr>
                        <tr>
                            <td align="center"colspan="2"height="35">
        &nbsp;<input name="btnAdd" type="button" value=" + " onclick="add()" />&nbsp;
                                <input name="btnSub" type="button" value=" - " onclick=""/>&nbsp;
                                <input name="btnMul" type="button" value=" * " onclick=""/>&nbsp;
                                <input name="btnDiv" type="button" value=" ÷ " onclick=""/>&nbsp;
                                </td>   
                        </tr>
                        <tr>
                            <tdheight="50" align="right">计算结果:</td>
                            <td><input id="txtResult" type="text" class="result"/></td>
                        </tr>
                           <tr>
                            <td colspan="2"height="25" bgcolor="#1191FF">
        &nbsp;&nbsp;
                                </td>   
                        </tr>
        </table>
        </form>

        </body>
</html>

灿烂的小居 发表于 2022-12-20 11:07

<!DOCTYPE html>
<html>
      <head>
                <meta charset="UTF-8">
                <title></title>
                <styletype="text/css">
                        table
                        {
                            border-collapse:collapse;
                              background-color:#a6a6d4;
                              width:500px;
                           }
                   .result
                           {
                           border:solid 1px #999999;
                                 color:#FF0033;
                                 font-family:Arial, Helvetica, sans-serif;
                                 font-size:16px;
                                 height:25px;
                           }
                </style>
                <script type="text/javascript">
                        function add()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                        document.getElementById("txtResult").value=parseInt(a)+parseInt(b);
                        }
                        function sub()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                        document.getElementById("txtResult").value=parseInt(a)-parseInt(b);
                        }
                        function mul()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                        document.getElementById("txtResult").value=parseInt(a)*parseInt(b);
                        }
                        function div()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                        document.getElementById("txtResult").value=parseInt(a)/parseInt(b);
                        }
                     
                </script>
      </head>
      <body>
                <form name="myform">
                <table border="0" align="center" cellpadding="0" cellspacing="0">
                        <tr>
                            <td height="28" colspan="2" align="left" bgcolor="#1191FF" ></td>   
                        </tr>
                        <tr>
                            <td height="43" colspan="2" align="center" bgcolor="#1191FF" > <h2>简易计算器</h2></td>   
                        </tr>
                        <tr>
                            <td height="35" align="right">数值1:</td>
                            <td><input id="txtNum1" type="text" /></td>
                        </tr>
                        <tr>
                            <tdheight="35" align="right">数值2:</td>
                            <td><input id="txtNum2" type="text" /></td>
                        </tr>
                        <tr>
                            <td align="center"colspan="2"height="35">
                              &nbsp;
                              <input name="btnAdd" type="button" value=" + " onclick="add()" />&nbsp;
                              <input name="btnSub" type="button" value=" - " onclick="sub()"/>&nbsp;
                              <input name="btnMul" type="button" value=" * " onclick="mul()"/>&nbsp;
                              <input name="btnDiv" type="button" value=" ÷ " onclick="div()"/>&nbsp;
                              </td>   
                        </tr>
                        <tr>
                            <tdheight="50" align="right">计算结果:</td>
                            <td><input id="txtResult" type="text" class="result"/></td>
                        </tr>
                           <tr>
                            <td colspan="2"height="25" bgcolor="#1191FF">
      &nbsp;&nbsp;
                              </td>   
                        </tr>
      </table>
      </form>

      </body>
</html>

fugeda46 发表于 2022-12-20 12:01

<!DOCTYPE html>
<html>
      <head>
                <meta charset="UTF-8">
                <title></title>
                <styletype="text/css">
                        table
                        {
                            border-collapse:collapse;
                              background-color:#a6a6d4;
                              width:500px;
                           }
                   .result
                           {
                           border:solid 1px #999999;
                                 color:#FF0033;
                                 font-family:Arial, Helvetica, sans-serif;
                                 font-size:16px;
                                 height:25px;
                           }
                </style>
                <script type="text/javascript">
                        function add()
                        {
                        var a=document.getElementById("txtNum1").value;
                        var b=document.getElementById("txtNum2").value;
                                                var result = parseFloat(a) + parseFloat(b);
                        document.getElementById("txtResult").value=result;
                        }
                                                function subtract() {
                                          var a = document.getElementById("txtNum1").value;
                                          var b = document.getElementById("txtNum2").value;
                                          var result = parseFloat(a) - parseFloat(b);
                                          document.getElementById("txtResult").value = result;
                                          }
                                                function multiply() {
                                          var a = document.getElementById("txtNum1").value;
                                          var b = document.getElementById("txtNum2").value;
                                          var result = parseFloat(a) * parseFloat(b);
                                          document.getElementById("txtResult").value = result;
                                           }

                                                function divide() {
                                                var a = document.getElementById("txtNum1").value;
                                                var b = document.getElementById("txtNum2").value;
                                                var result = parseFloat(a) / parseFloat(b);
                                                document.getElementById("txtResult").value = result;
                                                }
                                                                                          
                </script>
      </head>
      <body>
                <form name="myform">
                <table border="0" align="center" cellpadding="0" cellspacing="0">
                        <tr>
                            <td height="28" colspan="2" align="left" bgcolor="#1191FF" ></td>   
                        </tr>
                        <tr>
                            <td height="43" colspan="2" align="center" bgcolor="#1191FF" > <h2>简易计算器</h2></td>   
                        </tr>
                        <tr>
                            <td height="35" align="right">数值1:</td>
                            <td><input id="txtNum1" type="text" /></td>
                        </tr>
                        <tr>
                            <tdheight="35" align="right">数值2:</td>
                            <td><input id="txtNum2" type="text" /></td>
                        </tr>
                        <tr>
                            <td align="center"colspan="2"height="35">
      &nbsp;<input name="btnAdd" type="button" value=" + " onclick="add()" />&nbsp;
                              <input name="btnSub" type="button" value=" - " onclick="subtract()"/>&nbsp;
                              <input name="btnMul" type="button" value=" * " onclick="multiply()"/>&nbsp;
                              <input name="btnDiv" type="button" value=" ÷ " onclick="divide()"/>&nbsp;
                              </td>   
                        </tr>
                        <tr>
                            <tdheight="50" align="right">计算结果:</td>
                            <td><input id="txtResult" type="text" class="result"/></td>
                        </tr>
                           <tr>
                            <td colspan="2"height="25" bgcolor="#1191FF">
      &nbsp;&nbsp;
                              </td>   
                        </tr>
      </table>
      </form>

      </body>
</html>

幻之律 发表于 2022-12-20 12:56

感谢帮助

tencentma 发表于 2022-12-20 14:29

简单的计算器,用这个代码基本能实现

Break12580 发表于 2022-12-20 15:29

非常基础的开发练习,感谢分享
页: [1]
查看完整版本: 求补全代码(网页类),简易计算器