Javascript-форум - Изменение bgcolor строки таблицы

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Изменение bgcolor строки таблицы (https://javascript.ru/forum/misc/41724-izmenenie-bgcolor-stroki-tablicy.html)

Изменение bgcolor строки таблицы

День добрый!
Среда - Oracle (отсюда некоторая специфика расстановки символов ' ). По задумке, скрипт должен делать следующее:

1) по умолчанию, цвет ECF0F4
2) при наведении, цвет должен меняться на E6E8EE
3) при уходе, цвет должен меняться назад на ECF0F4
4) при нажатии, строка должна "выделяться"
5) до второго нажатия (или перезагрузки фрейма) цвет должен оставаться 9999FF

На деле, происходит какая-то мистика: при одинаковом синтаксисе в трех событиях, они работают, похоже, по воле высших сил (не подчиняясь законам логики). Менять ' на " пробовал, # ставил, и вообще шаманил как мог. через полчаса плясок плюнул и решил спросить совета.

Текст скрипта:

bgcolor=ECF0F4

onClick=
"if (this.style.background != '''||'#9999FF'||''') {this.style.background='''||'#9999FF'||''';} else {this.style.background='''||'#ECF0F4'||''';}"

onMouseOver=
"if (this.style.background != '''||'#9999FF'||''') this.style.background='''||'#E6E8EE'||'''"

onMouseOut=
"if (this.style.background != '''||'#9999FF'||''') this.style.background='''||'#ECF0F4'||'''"

Lachrimae,
вариант plugin selectable

Цитата:

Сообщение от Lachrimae

this.style.background != '''

почему не ''

Всё-таки напрямую кодить цвет - неправильно. Лучше добавляйте/удаляйте нужные классы, а в CSS опишите расцветку комбинаций.

Цитата:

Сообщение от Madzi (Сообщение 273813)

так в любом случае придем к той же самой ситуации, когда блоки IF творят беспредел, боюсь.

Цитата:

Сообщение от рони (Сообщение 273798)

Lachrimae,
вариант plugin selectable

На странице пых-пыха и jQuery нет и в общем-то не хотелось бы, поскольку я его в них разбираюсь еще хуже, чем в яваскрипте. :) Но вообще посмотрю, может чего-нибудь ценное для себя почерпну, спасибо.

Цитата:

Сообщение от рони (Сообщение 273799)

почему не ''

Потому что мне надо менять цвет по этому событию только если он уже не изменен на #9999FF.

Цитата:

Сообщение от Lachrimae (Сообщение 273840)

так в любом случае придем к той же самой ситуации, когда блоки IF творят беспредел, боюсь.

Если делать через CSS, то вам не нужны будут IF:
схематично:

Код:

onClick = addClass('active'), removeClass('over'), removeClass('default')

onMouseOver = addClass('over'), removeClass('active'), removeClass('default')

onMouseOut = addClass('default'), removeClass('active'), removeClass('over')

Цитата:

Сообщение от Lachrimae

Потому что мне надо менять цвет по этому событию только если он уже не изменен на #9999FF.

Вы можете объяснить, что означает этот набор кавычек и палочек?

if (this.style.background != '''||'#9999FF'||''')

по-моему должно быть так

if (this.style.background != '#9999FF')

Только учитывайте, что .style.background проверяет только инлайновый стиль, в CSS не лезет

палочки - конкатенация строк, кавычки - для того чтобы кавычки отобразились, это же SQL.

Madzi, спасибо! Lachrimae, прошу прощения, был полусонный, не дочитал.

Цитата:

Сообщение от BETEPAH (Сообщение 274818)

Вы можете объяснить, что означает этот набор кавычек и палочек?

if (this.style.background != '''||'#9999FF'||''')

PL/SQL, он такой! Синтаксис слегка специфичен.

Цитата:

Сообщение от Madzi (Сообщение 274813)

Если делать через CSS, то вам не нужны будут IF:
схематично:

Код:

onClick = addClass('active'), removeClass('over'), removeClass('default')

onMouseOver = addClass('over'), removeClass('active'), removeClass('default')

onMouseOut = addClass('default'), removeClass('active'), removeClass('over')

Все. Спасибо за, так сказать, косвенную помощь. Эта фича у меня не сработала, пока гуглил что это такое. нашел себе очень удобное и лаконичное решение:

onClick = "this.className = (this.className == ''active'' ? ''default'' : ''active'')"
onMouseOver = "this.className = (this.className == ''active'' ? ''active'' : ''over'')"
onMouseOut = "this.className = (this.className == ''active'' ? ''active'' : ''default'')"