如何在制作基于html的计算器时用javascript显示计算历史_Javascript_Html

如何在制作基于html的计算器时用javascript显示计算历史

javascript html

如何在制作基于html的计算器时用javascript显示计算历史,javascript,html,Javascript,Html,我试图制作一个基于HTML的计算器，它也会显示以前的计算历史，但我不知道该怎么做。如何将以前的计算结果存储为字符串或其他可供以后使用的内容？您好，我正在尝试制作一个基于HTML的计算器，它也会显示以前的计算历史记录，但我对如何操作感到困惑。如何将以前的计算结果存储为字符串或其他可供以后使用的内容 <html> <head> <script> //function that display value

我试图制作一个基于HTML的计算器，它也会显示以前的计算历史，但我不知道该怎么做。
如何将以前的计算结果存储为字符串或其他可供以后使用的内容？您好，我正在尝试制作一个基于HTML的计算器，它也会显示以前的计算历史记录，但我对如何操作感到困惑。
如何将以前的计算结果存储为字符串或其他可供以后使用的内容

<html> 
   <head> 
      <script> 
         //function that display value 
         function dis(val) 
         { 
             document.getElementById("result").value+=val 
         } 

         //function that evaluates the digit and return result 
         function solve() 
         { 
             let x = document.getElementById("result").value 
             let y = eval(x) 
             document.getElementById("result").value = y 
         } 

         //function that clear the display 
         function clr() 
         { 
             document.getElementById("result").value = "" 
         } 
      </script> 
      <!-- for styling -->
      <style> 
         .title{ 
         margin-bottom: 10px; 
         text-align:center; 
         width: 175px; 
         color:grey; 
         border: solid black 2px; 
         } 

         input[type="button"] 
         { 
         background-color:grey; 
         color: black; 
         border: solid black 2px; 
         width:100% 
         } 

         input[type="text"] 
         { 
         background-color:white; 
         border: solid black 2px; 
         width:100% 
         } 
      </style> 
   </head> 
   <!-- create table -->
   <body> 
      <div class = title >ITP2 Calculator</div> 
      <table border="1"> 
         <tr> 
            <td colspan="3"><input type="text" id="result"/></td> 
            <!-- clr() function will call clr to clear all value -->
         </tr> 
         <tr> 
            <!-- create button and assign value to each button -->
            <!-- dis("1") will call function dis to display value -->
            <td><input type="button" value="1" onclick="dis('1')"/> </td> 
            <td><input type="button" value="3" onclick="dis('3')"/> </td> 
            <td><input type="button" value="+" onclick="dis('+')"/> </td> 
         </tr> 
         <tr> 
            <td><input type="button" value="5" onclick="dis('5')"/> </td>  
            <td><input type="button" value="7" onclick="dis('7')"/> </td> 
            <td><input type="button" value="/" onclick="dis('')"/> </td> 
         </tr> 
         <tr> 
            <td><input type="button" value="9" onclick="dis('9')"/> </td> 
            <td><input type="button" value="Clr" onclick="clr()"/> </td>
            <td><input type="button" value="=" onclick="solve()"/> </td>   
         </tr> 
      </table> 
   </body> 
</html>


//显示值的函数
功能dis（val）
{ 
document.getElementById（“结果”）.value+=val
} 
//计算数字并返回结果的函数
函数solve（）
{ 
设x=document.getElementById（“结果”）.value
设y=eval（x）
document.getElementById（“结果”）.value=y
} 
//清除显示的功能
函数clr（）
{ 
document.getElementById（“结果”）.value=“”
} 
.标题{
边缘底部：10px；
文本对齐：居中；
宽度：175px；
颜色：灰色；
边框：纯黑2px；
} 
输入[type=“button”]
{ 
背景颜色：灰色；
颜色：黑色；
边框：纯黑2px；
宽度：100%
} 
输入[type=“text”]
{ 
背景色：白色；
边框：纯黑2px；
宽度：100%
} 
ITP2计算器

显示历史记录示例： 2+3=5

3+5=8

您可以创建一个函数，将数据保存到某个变量中，然后在每次需要向历史记录中添加内容时调用此函数。以下是一个例子：

let history = '';

function dis(val) {
    // your code...

    addToHistory(val);
}

function solve() {
    // your code...

    addToHistory('=' + y);
}

function clr() {
    // your code...

    addToHistory(' ');
}

function addToHistory(value) {
    history += value;
    document.getElementById('history').innerText = history;
}

你可以看看它是如何工作的：

请重写你问题的最后一句。事实上，这不太有道理。把你的问题缩小到一些你无法解决的非常具体的问题上。如果你只是问“我该怎么做”，这个问题可能就结束了。