Изменение цвета DIV фона, когда связь внутри DIV щелкают

Question

Так у меня есть эта кнопка, которая просто на самом деле ДИВ и у меня есть ссылка внутри DIV

<div id='button'> 
    <a href='#'>Link</a> 
</div> 

Я могу использовать CSS, чтобы изменить цвет фона, когда ссылка зависнет. Однако как изменить цвет фона при щелчке ссылки? Я считаю, что для этого требуется некоторый javascript? Если да, можете ли вы, ребята, помочь мне с java-скриптом? Это то, к чему я пришел, и все же он все еще не работает.

<a href="/page/login" onmousedown="document.getElementById('button').backgroundColor='lavender'">login</a> 

Answer 1

Я бы проверочные его с JavaScript и CSS. Следующий пример переключит цвет фона кнопки при каждом нажатии. Это делается путем добавления класса clicked к div или удаления его, если div уже получил этот класс.

HTML-код с встроенным JavaScript:

<div id="button"> 
    <a href="#" onmousedown="javascript:(btn=document.getElementById('button')).className = (btn.className == 'clicked') ? '' : 'clicked';">Link</a> 
</div> 

CSS-код:

#button { 
    background-color: #ccc; 
} 

#button.clicked { 
    background-Color: #123abc; 
} 

Answer 2

onmousedown="document.getElementById('button').style.backgroundColor='lavender'" 

Answer 3

Вы также можете попробовать использовать:

<div id='button'> 
    <a href='#' onmousedown="this.parentNode.style.backgroundColor='lavender';">Link</a> 
</div> 

Обратите внимание, что вы можете использовать один и тот же код без изменение на любом якоре или других элементах, поскольку оно будет применено к любому родительскому объекту.