在按下另一个按钮后，如何只给一个按钮一次功能？

Question

<html>
  <head>
    <meta charset="UTF-8" />
    <title>Taschenrechner</title>
    <script type="text/javascript">
      function Check(Eingabe) {
        var nur_das = "0123456789[]()-+*%/";
        for (var i = 0; i < Eingabe.length; i++)
          if (nur_das.indexOf(Eingabe.charAt(i)) < 0) return false;
        return true;
      }

      function Ergebnis() {
        var x = 0;
        var y = 0;
        if (Check(window.document.Rechner.Display.value))
          y = window.document.Rechner.Display.value;
        window.document.Rechner.Display2.value = y;
        x = eval(window.document.Rechner.Display.value);
        window.document.Rechner.Display.value = "=" + x;
      }

      function add(Zeichen) {
        window.document.Rechner.Display.value =
          window.document.Rechner.Display.value + Zeichen;
      }

      function backspace() {
        var arrayexit = window.document.Rechner.Display.value;
        for (var i = 0; i < arrayexit.length; i++) {
          var output = arrayexit.slice(0, -1);
          window.document.Rechner.Display.value = output;
        }
      }

      var myTableDiv = document.getElementById("Historie");
      var table = document.createElement("TABLE");
      var tableBody = document.createElement("TBODY");
      table.border = "1";
      table.appendChild(tableBody);
      var array = new Array();

      function ausgabe() {
        var array = new Array();
        array.push(
          window.document.Rechner.Display2.value +
            window.document.Rechner.Display.value
        );
        console.log(array);

        var myTableDiv = document.getElementById("Historie");
        var table = document.createElement("TABLE");
        var tableBody = document.createElement("TBODY");

        table.border = "1";
        table.appendChild(tableBody);

        var tr = document.createElement("TR");
        tableBody.appendChild(tr);
        var th = document.createElement("TH");
        th.width = "75";
        th.appendChild(document.createTextNode(array[0]));
        tr.appendChild(th);
        myTableDiv.appendChild(table);
      }
    </script>
    <style type="text/css">
      .button {
        width: 60px;
        text-align: center;
        font-family: System, sans-serif;
        font-size: 100%;
      }

      .display {
        width: 100%;
        text-align: right;
        font-family: System, sans-serif;
        font-size: 100%;
      }
    </style>
  </head>

  <body bgcolor="#FFFFE0" text="#000000">
    <form name="Rechner" action="" onSubmit="Ergebnis();return false;">
      <table style="float: left;" border="5" cellpadding="10" cellspacing="0">
        <tr>
          <td bgcolor="#C0C0C0">
            <input
              type="text"
              name="Display2"
              align="right"
              class="display"
              readonly
            />
            <input
              type="text"
              name="Display"
              align="right"
              class="display"
              readonly
            />
          </td>
        </tr>

        <tr>
          <td bgcolor="#E0E0E0">
            <table border="0" cellpadding="0" cellspacing="2">
              <tr>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  7   "
                    onClick="add('7')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  8   "
                    onClick="add('8')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  9   "
                    onClick="add('9')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  <-  "
                    onClick="backspace()"
                  />
                </td>
              </tr>

              <tr>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  4   "
                    onClick="add('4')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  5   "
                    onClick="add('5')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  6   "
                    onClick="add('6')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  +   "
                    onClick="add('+')"
                  />
                </td>
              </tr>
              <tr>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  1   "
                    onClick="add('1')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  2   "
                    onClick="add('2')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  3   "
                    onClick="add('3')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  -   "
                    onClick="add('-')"
                  />
                </td>
              </tr>
              <tr>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  .   "
                    onClick="add('.')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  0   "
                    onClick="add('0')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  =   "
                    onClick="Ergebnis();ausgabe()"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  *   "
                    onClick="add('*')"
                  />
                </td>
              </tr>

              <tr>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value=" ( "
                    onClick="add('(')"
                  />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value=" ) "
                    onClick="add(')')"
                  />
                </td>
                <td>
                  <input type="reset" width="60" class="button" value="  C  " />
                </td>
                <td>
                  <input
                    type="button"
                    width="60"
                    class="button"
                    value="  /   "
                    onClick="add('/')"
                  />
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </form>

    <div id="Historie" bground="red" width="250px" heigth="900px"></div>
  </body>
</html>

在用户按下“=”并调用函数“Ergebnis”和“ausgabe”后，我希望他下次按下数字时擦除 2 个输入字段内的所有内容，但显然只是下一次。

也欢迎任何其他改进想法=)

在用户按下“=”并调用函数“Ergebnis”和“ausgabe”后，我希望他下次按下数字时擦除 2 个输入字段内的所有内容，但显然只是下一次。

也欢迎任何其他改进想法=)

Answer 1

你能检查一下这个解决方案吗？

<html>
<head>
<meta charset="UTF-8">
<title>Taschenrechner</title>
<script type="text/javascript">

var equalsPressed = false;
function Check(Eingabe)
{
  var nur_das ="0123456789[]()-+*%/";
  for (var i = 0; i < Eingabe.length; i++)
   if (nur_das.indexOf(Eingabe.charAt(i))<0 ) return false;
  return true;
}

function Ergebnis()
{
    equalsPressed = true;
   var x = 0;
   var y = 0;

    if (Check(window.document.Rechner.Display.value) || equalsPressed)
    y = window.document.Rechner.Display.value;
    window.document.Rechner.Display2.value = y;
    x = eval(window.document.Rechner.Display.value);    
   window.document.Rechner.Display.value ="="+x;
}

function add(Zeichen)
{
   if(equalsPressed) {
    window.document.Rechner.Display2.value = " ";
    window.document.Rechner.Display.value = " ";
   }
   window.document.Rechner.Display.value =
   window.document.Rechner.Display.value + Zeichen;
   equalsPressed = false;
}

function backspace()
{
   var arrayexit = window.document.Rechner.Display.value;
   for (var i = 0; i < arrayexit.length; i++) 
    {
        var output = arrayexit.slice(0, -1);
        window.document.Rechner.Display.value = output;

    }
}   



var myTableDiv = document.getElementById("Historie");
var table = document.createElement('TABLE');
var tableBody = document.createElement('TBODY');
table.border = '1';
table.appendChild(tableBody);
var array= new Array();
    
function ausgabe()
{
var array= new Array();
array.push(window.document.Rechner.Display2.value+
window.document.Rechner.Display.value);
console.log(array);

var myTableDiv = document.getElementById("Historie")
    var table = document.createElement('TABLE')
    var tableBody = document.createElement('TBODY')
    
    table.border = '1';
    table.appendChild(tableBody);
    

    var tr = document.createElement('TR');
            tableBody.appendChild(tr);
    var th = document.createElement('TH')
                th.width = '75';
                th.appendChild(document.createTextNode(array[0]));
                tr.appendChild(th);
                myTableDiv.appendChild(table)

}

</script>
<style type="text/css">
.button {
width:60px;
text-align:center;
font-family:System,sans-serif;
font-size:100%;
}

.display {
width:100%;
text-align:right;
font-family:System,sans-serif;
font-size:100%;
}

</style>
</head>




<body bgcolor="#FFFFE0" text="#000000">     



<form name="Rechner" action="" onSubmit="Ergebnis();return false;">
<table style="float:left" border="5" cellpadding="10" cellspacing="0">

<tr>
<td bgcolor="#C0C0C0">
<input type="text"name="Display2" align="right" class="display"readonly>
<input type="text"name="Display" align="right" class="display"readonly></td>
</tr>

<tr>
<td  bgcolor="#E0E0E0">
<table border="0" cellpadding="0" cellspacing="2">

<tr>
<td><input type="button" width="60" class="button" value="  7   " onClick="add('7')"></td>
<td><input type="button" width="60" class="button" value="  8   " onClick="add('8')"></td>
<td><input type="button" width="60" class="button" value="  9   " onClick="add('9')"></td>
<td><input type="button" width="60" class="button" value="  <-  " onClick="backspace()" ></td>
</tr>

<tr>
<td><input type="button" width="60" class="button" value="  4   " onClick="add('4')"></td>
<td><input type="button" width="60" class="button" value="  5   " onClick="add('5')"></td>
<td><input type="button" width="60" class="button" value="  6   " onClick="add('6')"></td>
<td><input type="button" width="60" class="button" value="  +   " onClick="add('+')"></td>

</tr>
<tr>
<td><input type="button" width="60" class="button" value="  1   " onClick="add('1')"></td>
<td><input type="button" width="60" class="button" value="  2   " onClick="add('2')"></td>
<td><input type="button" width="60" class="button" value="  3   " onClick="add('3')"></td>
<td><input type="button" width="60" class="button" value="  -   " onClick="add('-')"></td>

</tr>
<tr>
<td><input type="button" width="60" class="button" value="  .   " onClick="add('.')"    ></td>
<td><input type="button" width="60" class="button" value="  0   " onClick="add('0')"    ></td>
<td><input type="button" width="60" class="button" value="  =   " onClick="Ergebnis();ausgabe()"></td>
<td><input type="button" width="60" class="button" value="  *   " onClick="add('*')"    ></td>
</tr>

<tr>
<td><input type="button" width="60" class="button" value=" ( " onClick="add('(')"   ></td>
<td><input type="button" width="60" class="button" value=" ) " onClick="add(')')"   ></td>
<td><input type="reset"  width="60" class="button" value="  C  "                            ></td>
<td><input type="button" width="60" class="button" value="  /   " onClick="add('/')"></td>
</tr> 

</table>
</td></tr></table>
</form>

<div id="Historie"bground=red width=250px heigth=900px>                     
    
</div>`

</body>
</html>

在按下另一个按钮后，如何只给一个按钮一次功能？

How to give a function only once to a button, after another button was pressed?

html

javascript

css

event-handling

dom-events