Как обновить цвет фона строки таблицы в IE, используя Javascript / CSS?

Question

У меня есть таблица, которую я хочу «выделить» во время onmouseover / onmouseout. Я уже знаю, что это требуется в IE, но не в других браузерах.

Мне удалось обнаружить срабатывание событий, и этот тег TR эффективно работает. (Обратите внимание, что исходный класс «contentTableRow», похоже, не вызывает каких-либо проблем.)

class="contentTableRow" onclick="openForm('SomeID');" onmouseover="highlight('someRowID', true);" onmouseout="highlight('someRowID', false);" id="someRowID" 

Все в порядке, функция "highlight" срабатывает и фактически устанавливает соответствующий класс.

Просто IE не будет обрабатывать изменение имени класса CSS.

Вот фрагмент кода CSS, который я использую для внесения изменений.

.HighlightOn {
    cursor:pointer;
    background-color: #D1DFFF;
}

.HighlightOff {
    background-color: #E1EEFE;
}

Я вижу, что имена классов обновляются при отладке, а также проверяю их в Firebug. Но кажется, что IE не нравится это использование классов с тегом TR .. Это способ, которым я структурирую класс для таблиц? Любой совет?

Answer 1

Вы меняете class вместо className? class зарезервировано в Javascript как фактическое ключевое слово объявления класса, поэтому свойство называется className:

function highlight(id, b) {
    document.getElementById(id).className = (b ? "HighlightOn" : "HighlightOff");
}

Между прочим, вы можете просто передать «this» для выделения вместо идентификатора, поэтому не нужно делать document.getElementById() вызов

Answer 2

Спасибо за все указатели. Но, похоже, это сработало.

TR.HighlightOn td {
    cursor:pointer;
    background-color: #D1DFFF;
}

TR.HighlightOff  td {
    cursor:pointer;
    background-color: #E1EEFE;
}

В этом случае, в основном, необходимо указать, где класс используется в HTML.

Обратите внимание, что мне приходилось ссылаться на тег TR и теги TD относительно того, где я использую классы Highlighton / off в таблице. Спасибо, Дженсграм.

Надеюсь, это поможет кому-то еще с той же проблемой.

(спасибо Jensgram за лидерство)

Answer 3

IE не распознает «класс» в JavaScript. Вы должны использовать "className" как свойство в IE.