JQuery: временно измените стиль, затем reset в исходный класс

Скажем, у меня есть класс с именем testThing:

.testThing
{
   background-color:#000000;
   float:left;
   height:50px;
   width:50px;
}

И я хочу, чтобы иметь возможность протестировать изменение цвета фона для любого элемента управления этого класса при нажатии кнопки:

function setColor(someColor) 
{
   jQuery('.testThing').css('background-color', someColor);
}

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

function resetClass()
{
   jQuery('#currentColor').removeClass('testThing');
   jQuery('#currentColor').addClass('testThing');
}

Похоже, что это сработает (Albiet не лучший способ сделать это), но цвет фона управления не reset к исходному значению, содержащемуся в этом классе.

Теперь либо мне нужно выяснить, почему это удалить, а не reset или просто простой способ сделать это... видя, что кажется глупым удалить и прочитать класс...

Ответ 1

Jquery добавляет CSS в атрибут стиля, который имеет более высокий приоритет над тем, что находится в вашем файле CSS. Вы не изменяете свой документ CSS с помощью этой функции, и поэтому добавление и удаление и добавление класса не имеют никакого эффекта, поскольку он не был изменен вообще!

Вы должны использовать ту же функцию, но на этот раз установите цвет фона на черный.

function reset(this)
{
  $(this).css('background-color', '#000000');
}

Или просто удалите атрибут стиля

function reset(this)
{
  $(this).removeAttr('style');
}

Ответ 2

Я знаю, что это старое, но вы можете просто установить значение в пустую строку, чтобы удалить свой собственный стиль следующим образом:

// set
$(this).css('background-color', '#000000');

// reset
$(this).css('background-color', '');

Ответ 3

Как насчет toggleClass("testThing")? Я использую его, когда меняет более одного свойства.

http://api.jquery.com/toggleClass/

Ответ 4

Лучше просто добавить еще один класс, который переопределяет стиль, который вы хотите изменить, и затем удалите его. Он превосходит жесткую информацию о стиле кодирования внутри js. Единственная проблема заключается в том, что вы должны обеспечить, чтобы добавленный класс был более высокого порядка, так что элемент принимает стиль от него, а не существующий класс, но это не сложно.