Nubware
@Nubware
Нуб – он и в Африке нуб.

JQuery: Возможно ли оптимизировать добавление класса в момент нажатия на кнопку?

Здравствуйте!

Есть кнопка (.button), к которому цепляется класс (.button_pressed) в момент нажатия. На чистом CSS за это отвечает псевдокласс :active.

// Нажатие на кнопку
$(document).on("mousedown", ".button", function(e) {
	$(this).addClass("button_pressed");
});
$(document).on("mouseup", ".button", function(e) {
	$(this).removeClass("button_pressed");
});


Возможно ли (если то необходимо) оптимизировать код? Быть может есть решение лучше? Что смущает в данном варианте: топорный дубликат строк. Сам пока постигаю "азы", собирая собственную CSS-библиотеку компонентов на основе БЭМ.

Спасибо!
  • Вопрос задан
  • 335 просмотров
Решения вопроса 2
Creamov
@Creamov
Senior Fullstack Software Engineer
Как вам такой вариант?
$(document).on('mousedown mouseup mouseout', '.button', function(e) {
    $(this).toggleClass('button_pressed', e.type == 'mousedown');
});
Ответ написан
@YNile
JS Developer
Ваш метод не сработает если нажать на кнопку а отпустить кнопку мыши не на кнопке
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы