Есть ли способ (возможно, с использованием Javascript?) Изменения деталей CSS-элемента, когда пользователь нажимает ссылку HTML?

Моя цель здесь - выделить серию ссылок, определенных как:

<a href="#" title="MyLink"><span>Link</span></a>

И класс, определенный как:

.Document
{
    background:#000;
}

После того, как Пользователь щелкает MyLink, я бы хотел, чтобы класс Document изменил свой фон на что-то другое ... скажем, #CCC. Я также хотел бы, чтобы он вернулся в исходное состояние при выборе другой ссылки, например, MyLink2 .

Это вообще возможно? Если так, кто-нибудь знает, где искать хотя бы начало решения?

1
TK. 21 Июл 2010 в 15:00

4 ответа

Лучший ответ

JQuery ! - http://jquery.com/

$("your-selector").click(function(){
    $("your-destination").css("border-color","#CCC");
});

Подайте заявку на каждую ссылку, и она должна это сделать!

4
TK. 21 Июл 2010 в 14:38
<a href="#" title="MyLink" onclick='document.body.style.background="#CCC";'>Link</a>
1
Ahmed Aman 21 Июл 2010 в 11:04

Я предполагаю, что имя класса .Document относится к ряду других элементов, а не к самой ссылке.

В этом случае рекомендуется создать другое имя класса (например, .document-active) и изменить имя класса для всех элементов, к которым применяется .Document, когда нажимается MyLink.

Используя вашу разметку выше (и jQuery):

$(function(){
  $("a[title='MyLink']").click(function(){
    $('.Document').removeClass('Document').addClass('document-active');
    return false;
  });
});
0
Jayphen 21 Июл 2010 в 11:50

Вы можете использовать псевдо-селектор CSS :focus:

a:focus {
  background-color: #ccc;
}

Теперь, когда пользователь нажимает на ссылку, фон становится серым.

1
DisgruntledGoat 21 Июл 2010 в 11:16