1

Имеется функция, которая меняет цвет строки таблицы при наведении на нее курсора мыши. Предположим, что одна из строк имеет backgroundColor = "yellow"(в то время как остальные - белые). Каким образом заставить обработчик mouseover\mouseout не совершать событие на "желтой" строке, дабы не перетирать бэкграунд? Спасибо!

function lightingRows() {
  var row = document.getElementsByClassName("row_class");
  [].forEach.call(row, function(row) {
    row.addEventListener('mouseover', function() {
      this.style.backgroundColor = "grey";
    });
    row.addEventListener('mouseout', function() {
      this.style.backgroundColor = "white";
    });
  });
}

5
  • 1
    Ответ внутри вопроса. Нужно добавить условие if (this.style.backgroundColor == "yellow") return; если бэкграунд равен такому-то значению, ничего не делаем.
    – Илья
    27 дек 2017 в 11:12
  • добавьте к этой строке какой-нибудь класс, и вообще не вешайте обработчик на эту строку
    – teran
    27 дек 2017 в 11:17
  • бэкграунд тоже проще менять доабвлением класса, тогда при наличии двух классов не менять цвет в css
    – teran
    27 дек 2017 в 11:18
  • да и вообще может через :hover решить
    – teran
    27 дек 2017 в 11:19
  • Спасибо за подсказки. Уже немного подустал) 27 дек 2017 в 12:01

1 ответ 1

1

Можно просто добавить условие проверки на неравенство стиля backgroundColor значению "yellow" (как вам написал @Илья). Вот так:

function lightingRows() {
  var row = document.getElementsByClassName("row_class");
  [].forEach.call(row, function(row) {
    row.addEventListener('mouseover', function() {
      if (this.style.backgroundColor != "yellow") {
        this.style.backgroundColor = "grey";
      }
    });
    row.addEventListener('mouseout', function() {
      if (this.style.backgroundColor != "yellow") {
        this.style.backgroundColor = "white";
      }
    });
  });
}
3
  • 1
    Спасибо за подсказку! 27 дек 2017 в 12:00
  • странная какая-то вещь, если вместо yellow поставить #a2dde3 или любой другой неименованный цвет - как-то не хочет отрабатывать... 27 дек 2017 в 13:15
  • 1
    @TheHateInMe все правильно, не странно. Ведь сравниваются строки 27 дек 2017 в 13:19

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

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