Вопрос по джеквери

Question

Вопрос по джеквери

Ваас Монтенегро Знаток (253), закрыт 5 лет назад

помогите пожалуйста я сделал калькулятор$(document).ready(function() {
//кнопки
$('#button1').on("click", function() {
a = $(this).val();
$('.tablo').html($('.tablo').html() + a);
});
$('#button2').on("click", function() {
b = $(this).val();
$('.tablo').html($('.tablo').html() + b);
});
$('#button3').on("click", function() {
w = $(this).val();
$('.tablo').html($('.tablo').html() + w);
});
$('#button4').on("click", function() {
e = $(this).val();
$('.tablo').html($('.tablo').html() + e);
});
$('#button5').on("click", function() {
r = $(this).val();
$('.tablo').html($('.tablo').html() + r);
});
$('#button6').on("click", function() {
t = $(this).val();
$('.tablo').html($('.tablo').html() + t);
});
$('#button7').on("click", function() {
y = $(this).val();
$('.tablo').html($('.tablo').html() + y);
});
$('#button8').on("click", function() {
u = $(this).val();
$('.tablo').html($('.tablo').html() + u);
});
$('#button9').on("click", function() {
i = $(this).val();
$('.tablo').html($('.tablo').html() + i);
});
$('#button0').on("click", function() {
o = $(this).val();
$('.tablo').html($('.tablo').html() + o);
});

//действия
$('#clean').on("click", function() {
z=$(this).val();
$('.tablo').html(0);

});
$('#tochca').on("click", function() {
tk = $(this).val();
$('.tablo').html($('.tablo').html() + tk);
});
$('#umn').on("click", function() {
um = $(this).val();
$('.tablo').html($('.tablo').html() + um);
});
$('#del').on("click", function() {
del = $(this).val();
$('.tablo').html($('.tablo').html() + del);
});
$('#plus').on("click", function() {
c = $(this).val();
$('.tablo').html($('.tablo').html() + c);
});
$('#minus').one("click", function() {
m = $(this).val();
$('.tablo').html($('.tablo').html() + m);
});
$('#ravno').on("click", function() {
s = $('.tablo').html();

$('.result').html( " Ответ: " +eval(s))

});

});
Как сделать так чтоб не мог писать +++++++++

Answer 1

Код вводящих кнопок можно сократить, если сохранить функцию в переменную:

var vvod = function() {
m = $(this).val();
$('.tablo').html($('.tablo').html() + m);
};

$("#button1").on("click", vvod);
$("#button2").on("click", vvod);
…

А для плюса оставить отдельную функцию, в которой проверить последний знак из табло при помощи функции endsWith:

$('#plus').on("click", function() {
var html = $('.tablo').html();
if (!html.endsWith("+")) {
c = $(this).val();
$('.tablo').html(html + c);
}
});

Answer 2

Ты издеваешься? Вот в этом спагетти-коде ещё какие-то дополнительные условия вешать? Перепиши всё с нуля, пока ещё не поздно, сделай универсальный обработчик. Тем более, ты уже умеешь работать с this.value. Самое время написать одну функцию, которая всё это будет считать.

Возьмём два произвольных куска твоего кода:
$('#button4').on("click", function() {
e = $(this).val();
$('.tablo').html($('.tablo').html() + e);
});

$('#button5').on("click", function() {
r = $(this).val();
$('.tablo').html($('.tablo').html() + r);
});

Если мы во втором обработчике заменим r на e, ты сможешь найти отличия от первого? Если нет, то напиши общий селектор $('#button4, button5') и напиши общий обработчик.
Но на этом не останавливайся, дальше тебе нужно уйти от уникальных идентификаторов и делать выборку по классу, а значения хранить в data-атрибутах кнопок.

И результат тоже храни в переменной, чтобы не читать каждый раз .html()