кнопка UI jQuery: Как я переопределяю классы, используемые для единственной кнопки?
Я пользуюсь библиотекой UI jQuery из поля, на основе темы.
Рендеринг ссылок как кнопки является большим, однако я должен переопределить некоторые кнопки с различными цветами.
Как я указываю определенный класс для конкретной кнопки для использования?
3 ответа
Я бы сказал, присвоить конкретной кнопке или кнопкам идентификатор и:
$("#buttonId").removeClass().addClass("myClass");
Если вы хотите применить его к нескольким кнопкам, каждая из которых имеет свой собственный идентификатор:
$("#buttonId, #anotherButton").removeClass().addClass("myClass");
Я рекомендую посмотреть на CSS для кнопок jQuery UI и продублировать структуру CSS, определяющую кнопки, но с собственным классом вместо классов jQuery UI. Сделайте нужные вам переопределения в этом CSS и включите его после CSS jQuery UI. CSS использует комбинацию наиболее специфического селектора и упорядочивания, чтобы определить, какие значения применять. Делая это, вы убедитесь, что у вас одинаковая специфика для каждого из селекторов CSS, используемых jQuery, так что ваш CSS будет иметь приоритет на основе порядка.
В Smashing Magazine есть статья, в которой, вероятно, больше информации, чем вы хотите знать о проблеме специфичности.
Если вы просто хотите иметь некоторые дополнительные/различные для определенных кнопок, просто присвойте кнопкам некоторые классы, например class="mybuttonclass otherbuttonclass" - допускается несколько классов. Затем просто добавьте правила css для вашего класса(ов)
.mybuttonclass
{
background-color: red;
}
.otherbuttonclass
{
color:white;
}
таким образом, фон будет красным с белым текстом - или любой комбинацией, которую вы хотите, которая будет переопределять элементы в каскаде (CSS) над ним. (предполагается, что ваш .CSS файл связан после jquery UI css файла, или находится в строке на странице, оба варианта будут перекрывать jQuery UI css.