除以0时的javaScript计算器

时间:2018-11-20 07:50:01

标签: javascript html css

<script>
function c(val)
{
    document.getElementById("d").value=val;
}
function math(val)
{
    document.getElementById("d").value+=val;
}
function e()
{
    try
    {
      c(eval(document.getElementById("d").value))
    }
    catch(e)
    {
      c('Error')
    }
}


</script>
<html>
<head>
<body>
    <br><br>
  
<div class="box">
    <div class="display"><input type="text" readonly size="16" id="d"></div>
    <div class="keys">

        <p>
        <input type="button" class="button gray" value="mrc" onclick='c("...Made by Shriyansh...")'>
        <input type="button" class="button gray" value="(" onclick='math("(")'>
        <input type="button" class="button gray" value=")" onclick='math(")")'>
        <input type="button" class="button pink" value="/" onclick='math("/")'>
        </p>
        <p>
        <input type="button" class="button red" value="7" onclick='math("7")'>
        <input type="button" class="button red" value="8" onclick='math("8")'>
        <input type="button" class="button red" value="9" onclick='math("9")'>
        <input type="button" class="button pink" value="*" onclick='math("*")'>
        </p>
        <p>
        <input type="button" class="button red" value="4" onclick='math("4")'>
        <input type="button" class="button red" value="5" onclick='math("5")'>
        <input type="button" class="button red" value="6" onclick='math("6")'>
        <input type="button" class="button pink" value="-" onclick='math("-")'>
        </p>
        <p>
        <input type="button" class="button red" value="1" onclick='math("1")'>
        <input type="button" class="button red" value="2" onclick='math("2")'>
        <input type="button" class="button red" value="3" onclick='math("3")'>
        <input type="button" class="button pink" value="+" onclick='math("+")'>
        </p>
        <p>
        <input type="button" class="button red" value="0" onclick='math("0")'>
        <input type="button" class="button red" value="." onclick='math(".")'>
        <input type="button" class="button red" value="C" onclick='c("")'>
        <input type="button" class="button orange" value="=" onclick='e()'>
        </p>
    </div>
</div>

</body>
</html>

当我将任何数字除以0时,它表示“无穷大”,但我希望通过显示“ NaN”而不是无穷大来显示结果。我尝试过,但我不知道。

    

<script>
function c(val)
{
    document.getElementById("d").value=val;
}
function math(val)
{
document.getElementById("d").value+=val;
}
function e()
{
try
{
  c(eval(document.getElementById("d").value))
}
catch(e)
{
  c('Error')
}
}


</script>
</head>
<body>
<br><br>
<center><h1>JavaScript Calculator</h1></center>
 <h2><center><a href="index.html">Scientific         
 Calculator</a></center></h2>
 <div class="box">
<div class="display"><input type="text" readonly                
size="16" id="d"></div>
<div class="keys">

    <p>
    <input type="button" class="button gray"      value="mrc" onclick='c("...Made by Shriyansh...")'>
    <input type="button" class="button gray" value="     (" onclick='math("(")'>
    <input type="button" class="button gray" value=")" onclick='math(")")'>
    <input type="button" class="button pink" value="/" onclick='math("/")'>
    </p>
    <p>
    <input type="button" class="button red" value="7" onclick='math("7")'>
    <input type="button" class="button red" value="8" onclick='math("8")'>
    <input type="button" class="button red" value="9" onclick='math("9")'>
    <input type="button" class="button pink" value="*" onclick='math("*")'>
    </p>
    <p>
    <input type="button" class="button red" value="4" onclick='math("4")'>
    <input type="button" class="button red" value="5" onclick='math("5")'>
    <input type="button" class="button red" value="6" onclick='math("6")'>
    <input type="button" class="button pink" value="-" onclick='math("-")'>
    </p>
    <p>
    <input type="button" class="button red" value="1" onclick='math("1")'>
    <input type="button" class="button red" value="2" onclick='math("2")'>
    <input type="button" class="button red" value="3" onclick='math("3")'>
    <input type="button" class="button pink" value="+" onclick='math("+")'>
    </p>
    <p>
    <input type="button" class="button red" value="0" onclick='math("0")'>
    <input type="button" class="button red" value="." onclick='math(".")'>
    <input type="button" class="button red" value="C" onclick='c("")'>
    <input type="button" class="button orange" value="=" onclick='e()'>
    </p>
</div>
 </div>

 </body>
 </html>

预先感谢

2 个答案:

答案 0 :(得分:0)

在您的c函数中使用条件运算符-如果valInfinity(或者我想是-Infinity),则显示NaN,否则显示val

function c(val) {
  document.getElementById("d").value = (val === Infinity || val === -Infinity) ? 'NaN' : val;
}

function math(val) {
  document.getElementById("d").value += val;
}

function e() {
  try {
    c(eval(document.getElementById("d").value))
  } catch (e) {
    c('Error')
  }
}
<br><br>
<center>
  <h1>JavaScript Calculator</h1>
</center>
<h2>
  <center><a href="index.html">Scientific         
 Calculator</a></center>
</h2>
<div class="box">
  <div class="display"><input type="text" readonly size="16" id="d"></div>
  <div class="keys">

    <p>
      <input type="button" class="button gray" value="mrc" onclick='c("...Made by Shriyansh...")'>
      <input type="button" class="button gray" value="     (" onclick='math("(")'>
      <input type="button" class="button gray" value=")" onclick='math(")")'>
      <input type="button" class="button pink" value="/" onclick='math("/")'>
    </p>
    <p>
      <input type="button" class="button red" value="7" onclick='math("7")'>
      <input type="button" class="button red" value="8" onclick='math("8")'>
      <input type="button" class="button red" value="9" onclick='math("9")'>
      <input type="button" class="button pink" value="*" onclick='math("*")'>
    </p>
    <p>
      <input type="button" class="button red" value="4" onclick='math("4")'>
      <input type="button" class="button red" value="5" onclick='math("5")'>
      <input type="button" class="button red" value="6" onclick='math("6")'>
      <input type="button" class="button pink" value="-" onclick='math("-")'>
    </p>
    <p>
      <input type="button" class="button red" value="1" onclick='math("1")'>
      <input type="button" class="button red" value="2" onclick='math("2")'>
      <input type="button" class="button red" value="3" onclick='math("3")'>
      <input type="button" class="button pink" value="+" onclick='math("+")'>
    </p>
    <p>
      <input type="button" class="button red" value="0" onclick='math("0")'>
      <input type="button" class="button red" value="." onclick='math(".")'>
      <input type="button" class="button red" value="C" onclick='c("")'>
      <input type="button" class="button orange" value="=" onclick='e()'>
    </p>
  </div>
</div>

答案 1 :(得分:0)

您可以像这样在功能c()中添加支票

function c(val)
{
if ( val == Infinity || val == -Infinity )
val = NaN;

document.getElementById("d").value=val;

}