JQuery addclass стилизация не работает, неправильный селектор? - PullRequest
Новая
       15

JQuery addclass стилизация не работает, неправильный селектор?

1 голос
/ 18 сентября 2009

<li id="leistungen"><a href="#Leistungen" onclick="sitemapChangeSubMenu('leistungen','leistungencontent','leistungen'); return false;">LEISTUNGEN</a> </li>

Это элемент списка, с которым я хочу создать стиль: 

$("#leistungen a").addClass("brown");

Это не работает ни для: 

$("#leistungen").addClass("brown");

мой код CSS просто 

.brown {
   color:brown;
}

Я не знаю, что не так, надеюсь, вы поможете мне:)

Большое спасибо!

Ответы [ 5 ]

6 голосов
/ 18 сентября 2009

Высказывание 

$("#leistungen").addClass("brown");

будет работать со всем текстом внутри #leistungen, но не с тегами привязки. У якорей есть стиль по умолчанию, который должен быть переопределен. Вы правы в письменной форме 

$("#leistungen a").addClass("brown");

Выполните тест, чтобы убедиться, что ваш Javascript выполняется, изменив его на 

$("#leistungen a").hide();

Если он исчезнет, ​​то вы знаете, что ваш Javascript работает с правильным элементом. Далее, попробуйте более конкретизировать свой селектор (может быть, что-то еще переопределяет ваши изменения). 

$("li#leistungen a").addClass("brown");

Если это не сработает, убедитесь, что JavaScript выполнен, а затем проверьте элемент. Есть ли у него новый класс? Если так, то проблема в CSS, а не в Javascript. Проверьте свой CSS-файл в стиле «.brown», чтобы найти синтаксические ошибки. Отсутствующий} из предыдущего стиля сделает это.

Попробуйте использовать "# 4C3F12" вместо слова "коричневый" в качестве цвета. 

.brown {
  color: #4C3F12;
}

Дайте мне знать, если это поможет!

3 голосов
/ 18 сентября 2009

Чувствительность к регистру - вы назвали свой якорь прописной буквой L. 

$("#Leistungen").addClass("brown");

В первом случае вам также потребуется использовать селектор класса, а не селектор идентификатора 

$(".leistungen a").addClass("brown");

Примечание. Я бы избегал совпадения классов и идентификаторов (с учетом регистра или без него).

HTML Атрибут ID Документы (выделено мной):

Атрибут ID однозначно идентифицирует элемент в документе. Нет двух элементы могут иметь одинаковое значение идентификатора в один документ. Атрибут значение должно начинаться с буквы в диапазон A-Z или a-z и может сопровождаться буквами (A-Za-z), цифрами (0-9), дефисы ("-"), подчеркивания ("_"), двоеточия (":") и точки ("."). The значение чувствительно к регистру.

0 голосов
/ 18 сентября 2009

Возможно, у вас где-то есть конфликтующее определение CSS. Если вы уверены, что JavaScript выполняется, проверьте это:

  1. Поскольку это идентификатор, убедитесь, что этот идентификатор также не присвоен другому тегу.
  2. Есть ли у вас какие-либо другие объявления CSS, которые применяются к тегам?

Попробуйте изменить объявление на: 

a.brown{ color: brown;}

Или .brown a {цвет: коричневый;}

В зависимости от того, используете ли вы $("#leistungen a").addClass("brown"); или $("#leistungen").addClass("brown");

0 голосов
/ 18 сентября 2009

У вас может быть проблема с специфичностью CSS здесь. Если исходный цвет вашего тега 'a' указан очень специфично, новое определение может не работать. Например: 

body #leistungen a {
   color: red;
}

.brown {
   color: brown;
}

В этом случае красный цвет имеет приоритет над коричневым, потому что первое определение более специфично, чем последнее. Попробуйте определить коричневый класс более конкретно: 

body #leistungen a.brown {
   color: brown;
}
0 голосов
/ 18 сентября 2009

У вас установлен firebug? В firebug вам нужно проверить, добавляется ли класс или нет. Если он добавлен, обновите кеш браузера, в противном случае проверьте ваш JavaScript.

...