L'effet final est comme illustré à la figure 2. Il y a un bogue: le résultat de cliquer sur% une fois Integer correct. Si% est cliqué après décimal, le résultat sera faux! Les autres sont normaux, donnez-moi des conseils: la valeur de l'entrée est de type de chaîne. Comment gérer correctement la pièce IF dans la figure-1 ci-dessous en js? ?
Figure-1
Figure-2
Le code HTML est le suivant
<body> <div id = "calculatrice"> <div> <span> calculatrice simple </span> <span> @walker </span> </ div> <div id = "shuru"> <! - Screen Input Bar -> <div> <input type = "Text" id = "screenname" name = "screenname"> </v> </v> <div Id = "keys"> <! - J -> <! type = "bouton" id = "7" onclick = "jsq (this.id)" value = "7"> <input type = "Button" id = "8" onclick = "jsq (this.id)" value = "8"> <input type = "Button" id = "9" onClick = "jsq (this.id)" vaigre (9 "> <entre type =" Button "id =" onclick = ")" 9 "> <entre type =" Value = "Back"> <Input type = "Button" id = "C" onClick = "Clearnum ()" value = "C" style = "margin-droite: 0px"> <! - Deuxième ligne -> <input type = "Button" id = "4" onClick = "jsq (this.id)" value = "4"> <entrée = "Button" id = "5" OnClick = "JSQ (that) <input type = "Button" id = "6" onclick = "jsq (this.id)" value = "6"> <input type = "Button" id = "*" onclick = "jsq (this.id)" value = "x"> <input type = "Button" id = "/" onclick = "jsq"> <! type = "bouton" id = "1" onclick = "jsq (this.id)" value = "1"> <input type = "bouton" id = "2" onclick = "jsq (this.id)" value = "2"> <input type = "bouton" id = "3" onclick = "jsq (this.id)" value = "3"> <entre type = "bouton" id = "+" + "+" + "+" 3 "> <entrée =" Button "Button" ID = "+" + "+" + "Value =" 3 "> <entrée =" Button "Button" ID = "+" + onclick = "jsq (this.id)" value = "+"> <input type = "bouton" id = "-" onClick = "jsq (this.id)" value = "-" style = "margin-droite: 0px"> <! - Quatrième rang onClick = "jsq (this.id)" value = "00"> <entrée type = "bouton" id = "." onClick = "jsq (this.id)" value = "."> <input type = "Button" id = "%" onClick = "jsq (this.id)" value = "%"> <input type = "Button" id = "eva" onclick = "eva ()" value = "=" style = "margin-right: 0px"> </v> </v> <p> <pandif> Welcome To Javascript </panne> </panne> </v> <p> <pandif> Wellow to Javascript </spank> </v> </v> <pank <a href = "#" Target = "_ Blank"> feedback </a> </span> </div> </div> </odyfing>
Le code CSS est le suivant:
<style> / * réinitialisation de base * / * {margin: 0; rembourrage: 0; Dimensionnement en boîte: Border-Box; FONT: 14px arial, sans-serif;} html {hauteur: 100%; Background-Color: LightsLategrey;} # Calculator {margin: 15px auto; Largeur: 330px; hauteur: 400px; Border: 1px Solid Lightgray; Color d'arrière-plan: Darkgrey; rembourrage: 15px;} / * logo * /. logo {hauteur: 20px;}. LOGO .NAME {float: Left; line-height: 30px;}. Logo .verson {float: droit; Line-Height: 30px;} / * écran * / # shuru {margin-top: 15px;}. Screen {margin-top: 5px; Largeur: 300px; hauteur: 40px; Texte-aligne: à droite; Padding-droite: 10px; Font-Size: 20px;} # Keys {Border: 1Px Solid LightGray; hauteur: 223px; marge: 25px; rembourrage: 8px;} # keys .last {margin-droite: 0px;}. Footer {margin-top: 20px; hauteur: 20px;}. Footer .Link {float: droite;} # keys .buttons {float: gauche; Largeur: 42px; hauteur: 36px; Texte-aligne: Centre; Color en arrière-plan: LightGray; marge: 0 17px 20px 0;} </ style>Le code JavaScript est le suivant:
<cript> var num = 0; // Définissez les données de la première fonction d'entrée jsq (num) {// Obtenez la saisie actuelle if (num == "%") {document.getElementById ('screenname'). Value = math.round (document.getElementyId ('screenName'). Value) / 100; } else {document.getElementById ('screenname'). valeur + = document.getElementById (num) .Value; }} fonction eva () {// Calculez le Résultat d'entrée document.getElementById ("screenname"). Value = eval (document.getElementById ("screenname"). Value); } fonction clearnum () {// clear 0 document.getElementyid ("screenname"). value = null; document.getElementById ("ScreenName"). focus (); } fonction tuige () {// backspace var arr = document.getElementById ("screenname"); arr.value = arr.value.substring (0, arr.value.length - 1); } </ script>L'article ci-dessus JavaScript implémente l'effet de calculatrice simple [recommandé] est tout le contenu que je partage avec vous. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.