2015-05-29 4 views
0

Это CSS я пытаюсь применить ко всем ключевым словамJQuery addClass() функция

#showKeywords { 
    background-color:#5B1762; 
} 

Что я хочу сделать, это при нажатии на кнопку showKeywords подсвечиваются ключевые слова. Однако вместо выделения ключевых слов он применяет стиль css к кнопке. Я заметил, что идентификатор кнопки и имя стиля css совпадают. Как я могу изменить .keyword класс, не меняя стиль

$(document).ready(function() { 
    $("#showKeywords").click(function() { 
     $(".keyword").addClass("showKeywords"); 
    }); 
<div id="menuDiv"> 
    <span id="showVariables" class="button">Variables</span> 
    <span id="showKeywords" class="button">Keywords</span> 
</div> 
<br> 
&nbsp;&nbsp; 
<span class="keyword">public</span> 
<span class="keyword">static</span> 
<span class="keyword">void</span> main(String args[]) { 

кнопку (showKeywords) Я не позволил изменить название на #showKeywords или я бы сделал это.

+1

Это не класс - это идентификатор. –

+0

У вас фактически нет класса showKeywords в вашей таблице стилей (не тот, который мы видим в любом случае) – Phil

ответ

2

Try изменения

#showKeywords { 
    background-color:#5B1762; 
} 

в

.showKeywords { 
    background-color:#5B1762; 
} 

символ '#' символ перед showKeywords означает, что стили показаны только для элемента с идентификатором 'showKeyWords. Вам нужен CSS класс, обозначенный периодом.

EDIT

Если вы не можете изменить существующий CSS, вы должны добавить тег стиля в вашем HTML. Поместите следующий код внутри тега <head> этой страницы или в верхнюю часть файла, если вы используете страницу макета.

<style type="text/css"> 
    .showKeywords { 
     background-color:#5B1762; 
    } 
</style> 

И, наконец, если вы хотите, чтобы предотвратить кнопку showKeyWords от того, что цвет, а просто изменить идентификатор кнопки showKeyWords в вашем HTML и JavaScript, чтобы что-то другое.

+0

Мне не разрешено изменять существующий css: c – user3491583

+0

Да, я просто добавил существующий css в качестве класса, и он работает , – user3491583

Смежные вопросы