Меняем цвет текста и фона при клике на текст

Обновлено: 23 декабря, 2021

Для того чтобы поменять цвет и фон при клике на текст, пишем следующий код для тега :

<span class="span-option" style="border: 1px solid black; padding: 8px;">SPAN1</span>
<span class="span-option" style="border: 1px solid black; padding: 8px;">SPAN2</span>
<span class="span-option" style="border: 1px solid black; padding: 8px;">SPAN3</span>

и прописываем js:

<script language=”JavaScript”>
$('.span-option').on('click', function() {
$('.span-option').css('color', 'black');
$('.span-option').css('background-color', 'white');
$(this).css('color', 'white');
$(this).css('background-color', 'black');
})
</script>

Пояснение кода:

• 2,3 строка – возвращает span-ы в начальные значения (фон – белый, цвет текста – черный)
• строка 4,5 – меняет цвет span-a, по которому кликнули – фон на черный, и цвет текста – белый.

(7 оценок, среднее: 5,00 из 5)
Для того чтобы оценить запись, вы должны быть зарегистрированным пользователем сайта.

Загрузка...