Кто -нибудь может сказать, что делать? Я попытался построить калькулятор с JavaScript и HTML, все работает нормально, но ⇐ Html

[Anonymous]

Я хочу, чтобы код отображал историю в текстовом поле после работы Funciton Calc, проблема здесь заключается в том, что я хочу иметь возможность просматривать историю, нажимая кнопку «История», а также рассчитываю в любой момент после нажатия знака для расчета истории или выбора истории. /> Я не могу получить ввод для переполнения в y < /p>
< /li>
Я понятия не имею, как исправить, когда я ввожу номер, и Eval дает мне результат с знаком '=', я просто хочу, чтобы результат. Случай, после входа после числа, дисплей должен иметь x (введенное число), а не x+y = z (введенные числа), и если нет, он должен быть просто продолжать с введением числа, которое я не смог бы сделать < /p>
< /li>
Кнопка истории должна пройти через историю в порядке a+b = c, тогда C+d = E < /p>
< /li>


Расчет История для цикла показывает длину, но не определена < /p>
< /li>
Я хочу, чтобы история была показана в поле, в отличие от x+y = 55, x-y = 33 < /p>




let history = [];
function checkeyfn(event) {
var display = document.getElementById('display').value
var charCode = event.charCode;
var key = String.fromCharCode(charCode);
var key = event.key;
console.log('Initial length',display.length);
var allowedKeys = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9',
'+', '-', '*', '/', '%', '.', '(', ')'];
if (allowedKeys.includes(key)) {
var newvalue = document.getElementById("display").value += key;
if(display.value === newvalue){
var newvalue = document.getElementById("display").value += key;
}
if(display.value !== newvalue && allowedKeys.includes(key))
{
if (display.length > 1 && history.length > 0) {
console.log("checking if history is here ", history);
for (var i = history.length; i >= 0, i++;) {
console.log('I am being called History', history, 'Loop number', i);
// var lastdigit = history.split('=');
console.log('I am being called Last digit', lastdigit);
}
console.log('Check if lastdigit is added', lastdigit);
console.log('Check if new value is added', newvalue);
}
}

} else if (key === 'Enter' || key === '=') {
calculate();
} else if (key === 'Backspace') {
Del();
}

// Prevent default actions for some keys (optional)
if (['+', '-', '*', '/', '%'].includes(key)) {
event.preventDefault();
}
}

function calculate() {
var screenvalue = document.getElementById('display').value;
var historyvalue = history;
try {
console.log('This is screenvalue', screenvalue, 'And this is length', screenvalue.length);

if (screenvalue && screenvalue.match(/^[0-9+\-*/%().]+$/)) {
var result = eval(screenvalue);
console.log('The result is ', result);
document.getElementById('display').value = result;
if(screenvalue === result){
console.log('This 2')
}
var pushes = history.push(screenvalue + "=" + result);
showHistory();
}
else {
document.getElementById('display').value = "";
alert('Invalid Input');
}
} catch (e) {
document.getElementById("display").value = '!Undefined'; 9
console.log(e);
// setTimeout(clear(),500);

}

}

function clear1() {
document.getElementById("display").value = '0'
}
function Del() {
var display = document.getElementById("display");
display.value = display.value.slice(0, -1);
}
function showHistory() {
console.log('Pushed to history', history);
var historyDisplay = document.getElementById('display');

for (var i = history.length - 1; i >= 0; i--) {
historyDisplay.value = history;
var splits = [] = history.split('=',);
if (splits.length > 0) {
for (var i = splits.lenght; i

/* body {} */

.container {
box-shadow: 1px 1px 7px 1px rgb(133, 135, 136);
position: relative;
align-content: center;
border: 4px #58585853;
padding: 14px;
margin-top: 10% !important;
margin: auto;
border-radius: 3.78%;
/* border: rgba(177, 177, 177, 0.77), 2px; */
background-color: rgb(237, 244, 251);
height: fit-content;
width: fit-content;
text-align: center
}

.screen {
font-size: 20px;
background-color: rgb(92, 169, 92);
text-align: right;
text-overflow: inherit;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 0.999);
height: auto;
max-height: auto;
width: 80%;
}

.clear {
margin-left: 3px;
background-color: rgb(255, 255, 255);
height: 40px;
color: red;
font-size: 20px;
font-weight: bold;
max-height: fit-content;
position: inherit;
margin: 2%;
border-radius: 15%;
padding: 2%;

}

.history {
height: 40px;
color: rgb(255, 255, 255);
font-size: 20px;
border-radius: 10%;
background-color: rgb(69, 68, 68);
font-weight: bold;
}

.deletehistory {
height: 40px;
color: red;
font-size: 15px;
font-weight: bold;
}

.historyd {
width: 200px;
margin: auto;
text-align: left;
border: 1px solid #ccc;
padding: 10px;
max-height: 200px;
overflow-y: auto;
margin-top: 10px;
}

.history-item {
border-bottom: 1px solid #eee;
padding: 5px;
}

.disp {
padding: 10px;
width: 100%;
display: inline-block !important;

}

td .numbers {
box-shadow: 1px 1px 3px 1px rgb(93, 94, 94);
width: 80px;
height: 8vh;
background-color: rgba(222, 210, 218, 0.395);
border-radius: 15.45%;
box-shadow: 1px;
font-size: 20px;
}

td .sign {
box-shadow: 1px 1px 3px 1px rgb(101, 101, 101);
width: 80px;
height: 8vh;
font-size: 20px;
font-weight: bold;
background-color: rgba(17, 9, 14, 0.395);
border-radius: 15.45%;
box-shadow: 1px;
}

< /code>











































Test





enter code here

< /code>
< /div>
< /div>

< /code>

< /li>
< /ol>

Подробнее здесь: https://stackoverflow.com/questions/795 ... ript-and-h