Dynami c смена css класса в поле

Question

Я хотел бы изменить цвет в поле (td) [изменить цвет - изменить / перенести в другой класс css?]

Условие: Условие исходит от запрос "если". если (sb == true), то ничего не меняется, если (sb == false) "[else]", то класс css в (td class = "InputsForUserColor1") может измениться на class = "InputsForUserColor1Change".

Примечания (td class = "InputsForUserColor2") не изменяется

Мой html код (бритва / C#): переменная "sb" находится вне "if", принимает другое значение

 @for (int sth = 0; sth< ViewBag.sth; sth++)
{
                if (sb == true)
                {
                    varSth = "00:00";

                }
                else
                {
                   varSth = "20:00";

                }
                         @for (int sthElse = 0; sthElse< ViewBag.sthElse; sthElse++)
                          {
                                if (nr_columns == 2)
                                {
                                    <td id="td01" class="InputsForUserColor1"></td>
                                }
                                if (nr_columns == 3)
                                {
                                    <td id="td01" class="InputsForUserColor2"></td>
                                }
                          }
}

Мой CSS код:

.InputsForUserColor1, area {
    background-color: papayawhip;
    border: hidden;
    align-content: center;
    align-items: center;
    vertical-align: central;
}

.InputsForUserColor1Change, area {
    background-color: white;
    border: hidden;
    align-content: center;
    align-items: center;
    vertical-align: central;
}

лично я не написал его, потому что я не не знаю как к нему подойти

Answer 1

Если цвет должен быть установлен только один раз, когда страница отображается на сервере:

• установить целевой класс в переменной страницы CSHMTL (Razor C# кодовый блок с помощью @{}).

• использовать значение этой переменной (Razor @variableName Синтаксис).

  @* assume that 'sb' does not change its value inside the for loop *@
  @{ var userColor1 = sb == true ? "InputsForUserColor1" : "InputsForUserColor1Change"; }
  @for (int sth = 0; sth< ViewBag.sth; sth++) {
      @for (int sthElse = 0; sthElse< ViewBag.sthElse; sthElse++) {
          if (nr_columns == 2) {
              <td id="td01" class="@userColor1"></td>
          }
          else if (nr_columns == 3) {
              <td id="td01" class="InputsForUserColor2"></td>
          }
      }
  }
  

Это отобразит HTML с правильный класс, установленный при доставке страницы в браузер клиента.

Это не будет работать, если цвет должен измениться из-за взаимодействия с пользователем на стороне клиента (браузера). В этом случае вы должны использовать клиентский скрипт (JavaScript) для динамического изменения цвета. Для этого см. jQuery addClass .