Maison > Article > interface Web > HTML et JS implémentent une calculatrice simple
HTML et JS implémentent une calculatrice simple
- 小云云original
- 2018-03-05 15:09:342055parcourir
Il est également très simple d'implémenter la fonction de calculatrice en HTML et JS. Cet article vous explique principalement comment implémenter une calculatrice simple en HTML et JS. J'espère qu'il pourra vous aider.
Voici le code :
<!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>Recommandations associées :
Comment implémenter une calculatrice simple en HTML
Quatre règles simples pour la mise en œuvre de js Fonction de calcul d'opérations
Exemple de fonction simple de calcul de quatre opérations arithmétiques implémentée par JS
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn