как сделать ограничение на ввод операций? Если операция уже есть в строке при нажатии на кнопку калькулятора она не вводилась
function add(value) {
document.getElementById("textview").value += value;
}
function che() {
var res = [];
var answer;
if (document.getElementById("textview").value.includes("+")) {
res = document.getElementById("textview").value.split('+');
return answer = parseFloat(res[0]) + parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("-")) {
res = document.getElementById("textview").value.split('-');
return answer = parseFloat(res[0]) - parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("/")) {
res = document.getElementById("textview").value.split('/');
return answer = parseFloat(res[0]) / parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("*")) {
res = document.getElementById("textview").value.split('*');
return answer = parseFloat(res[0]) * parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("%")) {
res = document.getElementById("textview").value.split('%');
return answer = parseFloat(res[0]) % parseFloat(res[1]);
} else {
return answer = document.getElementById("textview").value;
}
}
function equals() {
var a = che()
document.getElementById('textview').value = a;
}
function clean() {
document.getElementById('textview').value = " ";
}
function backspace() {
let exp = document.getElementById('textview').value;
return document.getElementById('textview').value = exp.slice(0, -1);
}
const onlyNumber = e => {
const value = e.value;
e.value = value.replace(/\D/g, '')
}
function degree() {
return document.getElementById('textview').value =
parseFloat(document.getElementById("textview").value) ** 2;
}
<form name="form" action="">
<input class="textview" id="textview" value="" oninput="onlyNumber(this)">
</form>
<table>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="С" onclick="clean()"></td>
<td><input class="button-calc button-calc__active" type="button" value="x^2" onclick="degree()"></td>
<td><input class="button-calc button-calc__active" type="button" value="<-" onclick="backspace()"></td>
<td><input class="button-calc button-calc__active" type="button" value="%" onclick="add('%')"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="1" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="2" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="3" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="/" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="4" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="5" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="6" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="*" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="7" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="8" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="9" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="-" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="." onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="0" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="=" onclick="equals()"></td>
<td><input class="button-calc button-calc__active" type="button" value="+" onclick="add(value)"></td>
</tr>
</table>
Ответы (1 шт):
Автор решения: Lukas
→ Ссылка
Думаю можно решить регуляркой, но я с ними не дружу.
function add(value) {
let inputValue = document.getElementById("textview");
if (isDontHaveOperation(inputValue.value, value)) {
inputValue.value += value;
}
}
function che() {
var res = [];
var answer;
if (document.getElementById("textview").value.includes("+")) {
res = document.getElementById("textview").value.split('+');
return answer = parseFloat(res[0]) + parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("-")) {
res = document.getElementById("textview").value.split('-');
return answer = parseFloat(res[0]) - parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("/")) {
res = document.getElementById("textview").value.split('/');
return answer = parseFloat(res[0]) / parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("*")) {
res = document.getElementById("textview").value.split('*');
return answer = parseFloat(res[0]) * parseFloat(res[1]);
}
if (document.getElementById("textview").value.includes("%")) {
res = document.getElementById("textview").value.split('%');
return answer = parseFloat(res[0]) % parseFloat(res[1]);
} else {
return answer = document.getElementById("textview").value;
}
}
function equals() {
var a = che()
document.getElementById('textview').value = a;
}
function clean() {
document.getElementById('textview').value = " ";
}
function backspace() {
let exp = document.getElementById('textview').value;
return document.getElementById('textview').value = exp.slice(0, -1);
}
const onlyNumber = e => {
const value = e.value;
e.value = value.replace(/\D/g, '')
}
function degree() {
return document.getElementById('textview').value =
parseFloat(document.getElementById("textview").value) ** 2;
}
function isDontHaveOperation(inputValue, newValue){
const operation = ["+","-","*","/","%"];
return operation.includes(newValue) ? inputValue.split("")
.filter(c => operation.includes(c)).length < 1 : true;
}
<form name="form" action="">
<input class="textview" id="textview" value="" oninput="onlyNumber(this)">
</form>
<table>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="С" onclick="clean()"></td>
<td><input class="button-calc button-calc__active" type="button" value="x^2" onclick="degree()"></td>
<td><input class="button-calc button-calc__active" type="button" value="<-" onclick="backspace()"></td>
<td><input class="button-calc button-calc__active" type="button" value="%" onclick="add('%')"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="1" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="2" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="3" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="/" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="4" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="5" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="6" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="*" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="7" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="8" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="9" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="-" onclick="add(value)"></td>
</tr>
<tr>
<td><input class="button-calc button-calc__active" type="button" value="." onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="0" onclick="add(value)"></td>
<td><input class="button-calc button-calc__active" type="button" value="=" onclick="equals()"></td>
<td><input class="button-calc button-calc__active" type="button" value="+" onclick="add(value)"></td>
</tr>
</table>