0

JQuery должен при нажатии на кнопку менять ее цвет фона и цвет текста. Почему-то меняется только цвет заднего фона, а цвет текста не хочет меняться ни при каких обстоятельствах. Аналогичный код у всех работает.

$('.done_button').click(function(){
  $(this).css({
    "background": "#36FF17",
    "color": "#000000!important",
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="task unselectable">
    <div class="task_name">Задача</div>
    <div class="done_button unselectable">Сделано</div>
    <div class="not_done_button unselectable">Не сделано</div>
</div>

3
  • html код приложите
    – Alpha
    Commented 20 апр. 2020 в 11:58
  • 4
    Вы меняете цвет на черный, а он и так черный. Commented 20 апр. 2020 в 12:11
  • 1
    !important уберите
    – meine
    Commented 20 апр. 2020 в 12:15

1 ответ 1

2

Вам нужно убрать !important в свойстве color, так как при использовании функции css(), данные стили добавляются автоматически в сам тег:

То есть при нажатии на Сделано, то jQuery поменяет тег следующим образом

<div 
  class="done_button unselectable"
  style="background: rgb(54, 255, 23); color: rgb(0, 0, 0);">Сделано
</div>

$('.done_button').click(function(){
  $(this).css({
    "background": "#36FF17",
    "color": "#ff0019",
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="task unselectable">
    <div class="task_name">Задача</div>
    <div class="done_button unselectable">Сделано</div>
    <div class="not_done_button unselectable">Не сделано</div>
</div>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.