Я не уверен, как закодировать ANS-ключ для jquery калькулятора. Я знаю, что могу использовать глобальную переменную и после нажатия каждой кнопки обновлять значение ключа ANS. Тем не менее, я ищу другой, более эффективный способ сделать это. Кроме того, мой ANS-ключ должен иметь тот же текст / значение, что и последний номер, который был в поле ввода.
<!DOCTYPE html>
<html lang="en-US">
<head>
<title></title>
<meta charset="UTF-8">
<style>
.threadbit .thread {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.divTable {
display: table;
width: 20%;
text-align: center;
}
.divTableRow {
display: table-row;
}
.divTableCell,
.divTableHead {
border: 1px solid #999999;
display: table-cell;
padding: 3px 10px;
}
.divTableBody {
display: table-row-group;
}
button {
width: 60px;
height: 60px;
text-align: center;
line-height: 1.1em;
font-size: 1.1em;
border-color: white;
}
#input {
text-align: right;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
var result;
$("#input").prop("disabled", true);
$(".parseFloat").click(function() {
var text = $('#input').val();
if (text != "0") {
var value1 = text;
var ButtonVal = $(this);
var value2 = ButtonVal.text();
if (value2 != '.' || value1.indexOf('.') == -1) {
var inputfield = value1 + value2;
$('#input').val(inputfield);
}
} else {
$('#input').val();
}
});
$("#plus").click(function() {
var math = $('#input').val();
$('#input').val('');
$(".parseFloat").click(function() {
var math1 = $('#input').val();
var calculations1 = parseFloat(math)
var calculations2 = parseFloat(math1)
var result = calculations1 + calculations2
$("#equal").click(function() {
$('#input').val(result);
});
});
});
$("#subtract").click(function() {
var math = $('#input').val();
$('#input').val('');
$(".parseFloat").click(function() {
var math1 = $('#input').val();
var calculations1 = parseFloat(math)
var calculations2 = parseFloat(math1)
var result = calculations1 - calculations2
$("#equal").click(function() {
$('#input').val(result);
});
});
});
$("#multiply").click(function() {
var math = $('#input').val();
$('#input').val('');
$(".parseFloat").click(function() {
var math1 = $('#input').val();
var calculations1 = parseFloat(math)
var calculations2 = parseFloat(math1)
var result = calculations1 * calculations2
$("#equal").click(function() {
$('#input').val(result);
});
});
});
$("#division").click(function() {
var math = $('#input').val();
$('#input').val('');
$(".parseFloat").click(function() {
var math1 = $('#input').val();
var calculations1 = parseFloat(math)
var calculations2 = parseFloat(math1)
var result = calculations1 / calculations2
$("#equal").click(function() {
$('#input').val(result);
});
});
});
});
</script>
</head>
<body>
<form>
<input type="text" name="firstname" style="width:404px;height:60px;font-size:20px;" id="input"><br>
</form>
<div class="divTable">
<div class="divTableBody">
<div class="divTableRow">
<div class="divTableCell"><button type="text" id="sin">sin</button></div>
<div class="divTableCell"><button type="text" id="cos">cos</button></div>
<div class="divTableCell"><button type="text" id="tan">tan</button></div>
<div class="divTableCell"><input type="radio" name="mode" id="deg" value="deg">Deg</div>
<div class="divTableCell"><input type="radio" name="mode" id="rad" value="rad">Rad</div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button type="text" id="sin1">sin<sup>-1</sup></button></div>
<div class="divTableCell"><button type="text" id="cos1">cos<sup>-1</sup></button></div>
<div class="divTableCell"><button type="text" id="tan1">tan<sup>-1</sup></button></div>
<div class="divTableCell"><button type="text" id="pii">pi</button></div>
<div class="divTableCell"><button type="text">e</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button type="text">x<sup>y</sup></button></div>
<div class="divTableCell"><button type="text">x<sup>3</sup></button></div>
<div class="divTableCell"><button type="text">x<sup>2</sup></button></div>
<div class="divTableCell"><button type="text">e<sup>x</sup></button></div>
<div class="divTableCell"><button type="text">10<sup>x</sup></button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button type="text"><sup>y</sup>√x</button></div>
<div class="divTableCell"><button type="text"><sup>3</sup>√x</button></div>
<div class="divTableCell"><button type="text">√x</button></div>
<div class="divTableCell"><button type="text">In</button></div>
<div class="divTableCell"><button type="text">log</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button type="text">(</button></div>
<div class="divTableCell"><button type="text">)</button></div>
<div class="divTableCell"><button type="text">1/x</button></div>
<div class="divTableCell"><button type="text">%</button></div>
<div class="divTableCell"><button type="text">n!</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button class="parseFloat" type="text" value="7">7</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="8">8</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="9">9</button></div>
<div class="divTableCell"><button type="text" value="plus" id="plus">+</button></div>
<div class="divTableCell"><button type="text" id="back">Back</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button class="parseFloat" type="text" value="4">4</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="5">5</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="6">6</button></div>
<div class="divTableCell"><button type="text" value="minus" id="subtract">−</button></div>
<div class="divTableCell"><button type="text">Ans</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button class="parseFloat" type="text" value="1">1</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="2">2</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value="3">3</button></div>
<div class="divTableCell"><button type="text" value="*" id="multiply">×</button></div>
<div class="divTableCell"><button type="text" id="mplus">M+</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button class="parseFloat" type="text" value="0">0</button></div>
<div class="divTableCell"><button class="parseFloat" type="text" value=".">.</button></div>
<div class="divTableCell"><button type="text" id="exp">EXP</button></div>
<div class="divTableCell"><button type="text" value="/" id="division">÷</button></div>
<div class="divTableCell"><button type="text" id="mminus">M-</button></div>
</div>
<div class="divTableRow">
<div class="divTableCell"><button type="text" id="zip">±</button></div>
<div class="divTableCell"><button type="text" id="rnd">RND</button></div>
<div class="divTableCell"><button type="text" id="ac">AC</button></div>
<div class="divTableCell"><button type="text" id="equal">=</button></div>
<div class="divTableCell"><button type="text" id="mr">MR</button></div>
</div>
</div>
</div>
</body>
</html>
```