<!DOCTYPE html> <!-- JSCalculatorSimple.html --> <html lang="en"> <head> <meta charset="utf-8"> <title>Simple JavaScript Calculator</title> <style> input { font-family: consola, monospace; color: blue; } td { margin-left: auto; margin-right: auto; text-align: center; } table { border: thick solid; } </style> </head> <body> <h2>Simple JavaScript Calculator</h2> <form name="calcForm"> <table> <tr> <td colspan="4"><input type="text" name="display" style="text-align:right"></td> </tr> <tr> <td><input type="button" name="btn1" value="1" onclick="calcForm.display.value += '1'"></td> <td><input type="button" name="btn2" value="2" onclick="calcForm.display.value += '2'"></td> <td><input type="button" name="btn3" value="3" onclick="calcForm.display.value += '3'"></td> <td><input type="button" name="btnAdd" value="+" onclick="calcForm.display.value += ' + '"></td> </tr> <tr> <td><input type="button" name="btn4" value="4" onclick="calcForm.display.value += '4'"></td> <td><input type="button" name="btn5" value="5" onclick="calcForm.display.value += '5'"></td> <td><input type="button" name="btn6" value="6" onclick="calcForm.display.value += '6'"></td> <td><input type="button" name="btnSub" value="-" onclick="calcForm.display.value += ' - '"></td> </tr> <tr> <td><input type="button" name="btn7" value="7" onclick="calcForm.display.value += '7'"></td> <td><input type="button" name="btn8" value="8" onclick="calcForm.display.value += '8'"></td> <td><input type="button" name="btn9" value="9" onclick="calcForm.display.value += '9'"></td> <td><input type="button" name="btnMul" value="x" onclick="calcForm.display.value += ' * '"></td> </tr> <tr> <td><input type="button" name="btnClear" value="C" onclick="calcForm.display.value = ''"></td> <td><input type="button" name="btn0" value="0" onclick="calcForm.display.value += '0'"></td> <td><input type="button" name="btnEqual" value="=" onclick="calcForm.display.value = eval(calcForm.display.value)"></td> <td><input type="button" name="btnDiv" value="/" onclick="calcForm.display.value += ' / '"></td> </tr> </table> </form> </body> </html>
დააკოპირეთ
