Simple Html and Javacsript Calculator
4 years ago in Plain Text
<meta charset="UTF8">
<style>
input[type=button] {width:100px;height:50px;font-size:30px;}
input[type=text] {width:412px;height:50px;font-size:23px;}
</style>
<center>
<form name="calculator">
<input type="text" name="question" disabled>
<br>
<input type="button" value=" 1 " onclick="calculator.question.value += '1'" />
<input type="button" value=" 2 " onclick="calculator.question.value += '2'" />
<input type="button" value=" 3 " onclick="calculator.question.value += '3'" />
<input type="button" value=" + " onclick="calculator.question.value += '+'" style="background-color: #008fb3;"/>
<br/>
<input type="button" value=" 4 " onclick="calculator.question.value += '4'" />
<input type="button" value=" 5 " onclick="calculator.question.value += '5'" />
<input type="button" value=" 6 " onclick="calculator.question.value += '6'" />
<input type="button" value=" - " onclick="calculator.question.value += '-'" style="background-color: #008fb3;"//>
</br>
<input type="button" value=" 7 " onclick="calculator.question.value += '7'" />
<input type="button" value=" 8 " onclick="calculator.question.value += '8'" />
<input type="button" value=" 9 " onclick="calculator.question.value += '9'" />
<input type="button" value=" x " onclick="calculator.question.value += '*'" style="background-color: #008fb3;"//>
</br>
<input type="button" value="C" onclick="calculator.question.value = ''" style="background-color: #ff4d4d;"/>
<input type="button" value=" 0 " onclick="calculator.question.value += '0'" />
<input type="button" value=" = " onclick="calculator.answer.value = 'Answr= ' + eval(calculator.question.value)" style="background-color:#00ff00"/>
<input type="button" value=" / " onclick="calculator.question.value += '/'" style="background-color: #008fb3;"//>
</br></br>
<input type="text" name="answer" disabled>
</form>