2017-06-27 34 views
0

计算器链接:http://357682.cmd16a.cmi.hanze.nl/rekenmachine/calc.htmlNaN的错误和不工作的。减去

我想建立一个使用计算器HTML,CSS和JS,但我不能让它正常工作。有2(事实上是3)事情出错了。

第一个是减法。当我输入'4-2'时,结果是'6'而不是2,我不知道为什么。除此之外,当我做'4 * 2'或'4/2'(所以乘法和除法)它输出NaN。我不知道我的代码中出了什么问题。

$(document).ready(function() { 
 

 
    var display = ""; 
 
    var clear = 0; 
 
    var invoer = 0; 
 
    var mgetal = null; 
 
    scherm(clear); 
 

 
    $(".memory").on("click", function() { 
 
    if ($(this).hasClass("mem_add")) { 
 
     mgetal = (mgetal === null) ? (+$(".calcscherm").text()) : mgetal + 
 
     (+$(".calcscherm").text()); 
 
     $(".memoryscherm").html(mgetal); 
 
    } 
 
    if ($(this).hasClass("mem_less")) { 
 
     if (mgetal !== null) { 
 
     mgetal = mgetal - (+$(".calcscherm").text()); 
 
     $(".memoryscherm").html(mgetal); 
 
     } else { 
 
     $(".calcscherm").empty(); 
 
     $(".calcscherm").append("Geheugen is nog leeg"); 
 
     } 
 
    } 
 
    if ($(this).hasClass("mem_show")) { 
 
     if (mgetal !== null) { 
 
     $(".calcscherm").html(mgetal); 
 
     display = mgetal; 
 
     } else { 
 
     $(".calcscherm").empty(); 
 
     $(".calcscherm").append("Geheugen is nog leeg"); 
 
     } 
 
    } 
 
    if ($(this).hasClass("mem_clear")) { 
 
     if (mgetal !== null) { 
 
     mgetal = 0; 
 
     $(".memoryscherm").html("Geheugen is leeggehaald"); 
 
     } else { 
 
     $(".calcscherm").empty(); 
 
     $(".calcscherm").append("Geheugen is nog leeg"); 
 
     } 
 
    } 
 
    }); 
 

 
    $(".buttons span").on("click", function() { 
 
    var drukKnop = $(this).html(); 
 

 
    if (drukKnop === "+/-") { 
 
     display *= -1; 
 
    } else if (drukKnop === ".") { 
 
     display += "."; 
 
    } else if (nummer(drukKnop)) { 
 
     if (display === "0") display = drukKnop; 
 
     else display = display + drukKnop; 
 
    } else if (operator(drukKnop)) { 
 
     invoer = parseFloat(display); 
 
     reken = drukKnop; 
 
     display = reken; 
 
    } else if (drukKnop === "=") { 
 
     display = uitvoer(invoer, display, reken); 
 
     reken = null; 
 
    } 
 
    console.log(drukKnop); 
 
    scherm(display); 
 
    }); 
 

 
    $(".clear").on("click", function() { 
 
    $(".calcscherm").text("0"); 
 
    display = ""; 
 
    clear = 0; 
 
    }); 
 

 
    operator = function(value) { 
 
    if (value === "+") return value; 
 
    if (value === "-") return value; 
 
    if (value === "*") return value; 
 
    if (value === "/") return value; 
 
    }; 
 

 
    nummer = function(value) { 
 
    return !isNaN(value); 
 
    } 
 

 
    uitvoer = function(a, b, reken) { 
 
    a = parseFloat(a); 
 
    b = parseFloat(b); 
 
    console.log(a, b, reken); 
 
    if (reken === "+") return a + b; 
 
    if (reken === "-") return a - b; 
 
    if (reken === "*") return a * b; 
 
    if (reken === "/") return a/b; 
 
    } 
 

 
}); 
 

 
scherm = function(schermtekst) { 
 
    var schermtekst = schermtekst.toString(); 
 
    $(".calcscherm").html(schermtekst); 
 
};
<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> 
 
</script> 
 

 
<div id="calculator"> 
 
    <div class="container"> 
 
    <div class="memoryscherm"></div> 
 
    <div class="buttons" style="margin:0; margin-top: 10px;"> 
 
     <div class="row"> 
 
     <span class="memory mem_clear">MC</span> 
 
     <span class="memory mem_show">MR</span> 
 
     <span class="memory mem_add">M+</span> 
 
     <span class="memory mem_less memory-end">M-</span> 
 
     </div> 
 
    </div> 
 
    <div class="calcscherm"></div> 
 
    </div> 
 
    <div class="buttons"> 
 
    <div class="row"> 
 
     <span class="operator">+</span> 
 
     <span class="operator">-</span> 
 
     <span class="operator">/</span> 
 
     <span class="operator end">*</span> 
 
    </div> 
 
    <div class="row"> 
 
     <span class="number">7</span> 
 
     <span class="number">8</span> 
 
     <span class="number">9</span> 
 
     <span class="eval end">=</span> 
 
    </div> 
 
    <div class="row"> 
 
     <span class="number">4</span> 
 
     <span class="number">5</span> 
 
     <span class="number">6</span> 
 
     <span class="number">1</span> 
 
    </div> 
 
    <div class="row"> 
 
     <span class="number">2</span> 
 
     <span class="number">3</span> 
 
     <span class="number">.</span> 
 
     <span class="number">0</span> 
 
     <span class="clear">C</span> 
 
    </div> 
 
    </div> 
 
</div>

回答

0

当你得到一个opperator您保存并显示在屏幕上。然后当你得到下面的数字时,你不会删除操作者,仍然使用屏幕上的“字符串”来进行数学运算。

因此, “4 - 2” 变成 “4 - -2” ......等于6

“3 * 4” 是NaN,因为你做了parseFloat。

你的代码来处理一些应该像

} else if (nummer(drukKnop)) { 
    if (display === "0") display = drukKnop; 
    else if (nummer(display)) display = display + drukKnop; 
    else display = drukKnop; 
} 
+0

真棒人,使固定对我来说。现在它应该如何工作。谢谢! –