HTML Codes for making Working Calculator at Home😎😁

Hello everyone Today we are back with a topic “How to make calculator at home with HTML CODING”

HAPPY CODING TO ALL 🇮🇳🇮🇳🇮🇳🎉😎🎉😅

SO SOME SIMPLE CODES ARE BELOW. JUST COPY THEM.

******************************************
<html>

   <head>

      <script>

         //function that display value

         function dis(val)

         {

             document.getElementById(“result”).value+=val

         }

         

         //function that evaluates the digit and return result

         function solve()

         {

             let x = document.getElementById(“result”).value

             let y = eval(x)

             document.getElementById(“result”).value = y

         }

         

         //function that clear the display

         function clr()

         {

             document.getElementById(“result”).value = “”

         }

      </script>

      <!– for styling –>

      <style>

         .title{

         margin-bottom: 10px;

         text-align:center;

         width: 210px;

         color:green;

         border: solid black 2px;

         }

         input[type=”button”]

         {

         background-color:green;

         color: black;

         border: solid black 2px;

         width:100%

         }

         input[type=”text”]

         {

         background-color:white;

         border: solid black 2px;

         width:100%

         }

      </style>

   </head>

   <!– create table –>

   <body>

      <div class=”title”>
Inventips Calculator</div>
<table border=”1″>
<tr>

            <td colspan=”3″><input id=”result” type=”text” /></td>

            <!– clr() function will call clr to clear all value –>

            <td><input onclick=”clr()” type=”button” value=”c” /> </td>

         </tr>
<tr>

            <!– create button and assign value to each button –>

            <!– dis(“1”) will call function dis to display value –>

            <td><input onclick=”dis(‘1’)” type=”button” value=”1″ /> </td>

            <td><input onclick=”dis(‘2’)” type=”button” value=”2″ /> </td>

            <td><input onclick=”dis(‘3’)” type=”button” value=”3″ /> </td>

            <td><input onclick=”dis(‘/’)” type=”button” value=”/” /> </td>

         </tr>
<tr>

            <td><input onclick=”dis(‘4’)” type=”button” value=”4″ /> </td>

            <td><input onclick=”dis(‘5’)” type=”button” value=”5″ /> </td>

            <td><input onclick=”dis(‘6’)” type=”button” value=”6″ /> </td>

            <td><input onclick=”dis(‘-‘)” type=”button” value=”-” /> </td>

         </tr>
<tr>

            <td><input onclick=”dis(‘7’)” type=”button” value=”7″ /> </td>

            <td><input onclick=”dis(‘8’)” type=”button” value=”8″ /> </td>

            <td><input onclick=”dis(‘9’)” type=”button” value=”9″ /> </td>

            <td><input onclick=”dis(‘+’)” type=”button” value=”+” /> </td>

         </tr>
<tr>

            <td><input onclick=”dis(‘.’)” type=”button” value=”.” /> </td>

            <td><input onclick=”dis(‘0’)” type=”button” value=”0″ /> </td>

            <!– solve function call function solve to evaluate value –>

            <td><input onclick=”solve()” type=”button” value=”=” /> </td>

            <td><input onclick=”dis(‘*’)” type=”button” value=”*” /> </td>

         </tr>
</table>
</body>

</html> 

HAPPY CODING😎😎😎😎😎🇮🇳🇮🇳🇮🇳

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Post

Best Way to Learn Anything and Loop Theory in Hindi & EngBest Way to Learn Anything and Loop Theory in Hindi & Eng

सबसे अच्छा तरीका कुछ भी जानने के लिए और लूप थ्योरी हमारा आज का ब्लॉग है कुछ भी सीखने का सबसे अच्छा तरीका क्या है। दुनिया में सब कुछ संभव है यहां