<div class="calculate">
<div class="calculate__put">
<span class="tablo">0</span>
</div>
<div class="step1">
<div class="btn">7</div>
<div class="btn">8</div>
<div class="btn">9</div>
<div class="operator_x">x</div>
</div>
<div class="step1">
<div class="btn">6</div>
<div class="btn">5</div>
<div class="btn">4</div>
<div class="operator_minus">-</div>
</div>
<div class="step1">
<div class="btn">1</div>
<div class="btn">2</div>
<div class="btn">3</div>
<div class="operator_plus">+</div>
</div>
<div class="step1">
<div class="btn zero">0</div>
<div class="btn">.</div>
<div class="operator_equally">=</div>
</div>
</div>
* {
box-sizing: border-box;
}
.calculate {
background-color: #CD5C5C;
width: 300px;
height: 350px;
margin: 0 auto;
padding: 10px;
display: flex;
flex-direction: column;
border-radius: 0 0 20px 20px;
}
.calculate__put {
background-color: #FA8072;
height: 70px;
border: 2px solid #DC143C;
border-radius: 20px;
box-shadow: inset 1px 1px 5px 5px rgba(0, 0, 0, 0.5);
position: relative;
}
.calculate__put span {
font-size: 50px;
position:absolute;
right: 10px;
top: 3px;
}
.step1 {
display: flex;
flex-direction: row;
box-sizing: border-box;
}
.step1 div {
border: 1px solid #111;
font-size: 35px;
font-weight: 600;
display:flex;
justify-content: center;
align-items:center;
width: 70px;
height: 65px;
}
.zero {
min-width:140px;
}
.step1_left {
border-radius: 20px 0px 0px 0px;
}
.step1_rigth {
border-radius: 0px 20px 0px 0px;
}
.step1_rigth_bottom {
border-radius: 0px 0px 20px 0px;
}
.step1_left_bottom {
border-radius: 0px 0px 0px 20px;
}
let btnOperatorEqually = document.querySelector('.operator_equally');
let btnOperatorPlus = document.querySelector('.operator_plus');
let btnOperatorMinus = document.querySelector('.operator_minus');
let btnOperatorX = document.querySelector('.operator_x');
let rezult = document.querySelector('.tablo');
let btn = document.querySelectorAll('.btn');
for(let i = 0; i < btn.length; i++){
btn[i].addEventListener('click', function(e){
if(operators.operFlag === true || rezult.innerHTML == 0){
rezult.innerHTML = e.target.innerHTML;
operators.operFlag = false
} else {
rezult.innerHTML += e.target.innerHTML;
}
})
};
let operators = {
lastOper: '',
operFlag: false,
equally: function(){
if(lastOper === 'plus'){
tablo.result = +tablo.result + +rezult.innerHTML;
}else if(lastOper === 'minus'){
tablo.result = +tablo.result - +rezult.innerHTML;
}else if(lastOper === 'x'){
tablo.result = +tablo.result * +rezult.innerHTML;
}
operators.operFlag = true;
rezult.innerHTML = tablo.result;
tablo.result = 0;
},
plus: function(){
lastOper = 'plus';
tablo.result = +tablo.result + +rezult.innerHTML;
rezult.innerHTML = 0;
},
minus: function(){
lastOper = 'minus';
},
x: function(){
lastOper = 'x';
tablo.result = tablo.result * rezult.innerHTML;
rezult.innerHTML = 0;
},
};
let tablo = {
result: 0
}
btnOperatorEqually.addEventListener('click',operators.equally);
btnOperatorPlus.addEventListener('click',operators.plus);
btnOperatorMinus.addEventListener('click',operators.minus);
btnOperatorX.addEventListener('click',operators.x);
Немогу реализовать минус, приме вводе 12 -2 выдает -14, помогите