Addclass jquery не работает

Jquery — addClass и removeClass не работают

Я пытался переключить класс из тега i . Сначала я попробовал это с помощью switchClass пользовательского интерфейса Jquery:

Это не сработало. Я обнаружил, что у кого-то еще есть проблема с switchClass , и ему посоветовали использовать removeClass и <> вместо этого, который работал для него.

Однако для меня это не работает, и я сейчас растерялся.

Это действительно было из-за пропавшего » . Я доверял PhpStorm, чтобы найти это и указать на это . Я узнал: никогда не доверяйте своей IDE, даже если у вас есть дорогая.

5 ответов

Вы пропустили » в . Это сработало после того, как я изменил это. Если вы хотите, чтобы переключиться, переключитесь на addClass и removeClass с помощью toggleClass .

Вы забыли добавить отверстие «в

Вы можете проверить это так:

Возвращает ваш элемент div.

Таким образом, в настоящее время ваш идентификатор — sidenavIcon «

Вы только что пропустили одну двойную кавычку в своем HTML , следуйте ниже:
Вы написали id=sidenavIcon» , но вы должны написать id=»sidenavIcon»

Попробуйте это решение, оно работает гладко

Заменить id=sidenavIcon» на id=»sidenavIcon»

jQuery: use toggleClass (); вместо switchClass () или добавить или удалить класс. HTML: добавьте промах «перед

Источник

addClass в jquery не работает, как я хочу

У меня есть код, который добавляет класс ( .class2 ), используя jQuery. Класс применяется, но некоторые стили класса не работают:

4 ответа

Если вы загружаете библиотеку jquery, и все равно не работает. Вы можете добавить! Важное к стилю, чтобы переопределить стиль, вот пример кода в class2.

Проблема не в jQuery. Проблема в ваших правилах CSS.

Объяснение

Браузер всегда будет применять более конкретное правило, например:

Браузер проверит, какое правило более конкретное, в этом случае первое явно более конкретное.

Если вы хотите переопределить это правило, вы должны написать правило с по крайней мере той же специфичностью (проверьте этот калькулятор специфичности) .

Если правила имеют одинаковую специфику, применяется последнее.

Решение

Используйте инструменты разработчика вашего браузера, чтобы проверить, какое правило применяется к вашему элементу, а затем напишите правило с по меньшей мере одинаковой специфичностью.

Там нет точного решения, так как вся страница должна быть проанализирована.

Почему бы не важно?

Сначала давайте разберемся, как !important работает. ! важный заставит ваше правило обладать высшей специфичностью, такой как «бесконечная» специфика.

Таким образом, это правило можно переопределить только для правила после этого, также с помощью! Important.

Хорошо, это работает, решите мою проблему, верно?

Хотя это решит вашу проблему прямо сейчас, эта практика не очень хороша, и вам будет очень трудно поддерживать CSS.

Если вы используете его для всего, вы просто убиваете C из CSS (каскадных таблиц стилей), и вам нужно будет полагаться только на правила, а иногда вы просто не сможете писать правило, которое вы хотите.

Все, кто начал использовать CSS, думают, что Каскад — это скучная вещь, что использование! Важный на всем хорошо, но это не так. Рано или поздно вы поймете.

Это потому, что .item1 уже имеет background-color и переопределяет новый background-color , добавленный новым классом .class2 , поэтому вы можете попытаться сделать свое правило более конкретным, например:

Надеюсь это поможет.

Ваш код работает для меня (см. Ниже). Проверьте консоль разработчика, если ваши стили перезаписаны другими правилами. В этом случае используйте более высокую специфичность , например, .item1.class2 , чтобы перезаписать уже установленный цвет фона.

!important — это не решение , а, в лучшем случае, обходной путь (это плохая практика). Постарайтесь организовать ваши правила, чтобы иметь правильный порядок.

Источник

jQuery addClass не работает

Я пытаюсь использовать addClass, чтобы дать мне таблицы в полоску зебры на моем шаблоне Joomla. Im используя следующий код:

я смог использовать селектор tr:odd для динамического добавления css в строки таблицы, но когда я использую функцию addClass, она просто не работает (я проверил исходный код, и ни одна из строк таблицы не имеет класса «odd»).

понятия не имею, что я могу делать неправильно, был бы признателен за любую помощь.

5 ответов

Итак, вы знаете, изменения в DOM с Javascript не отражаются при просмотре источника.

этот код должен работать, если ваш CSS выглядит так.

вот два способа / метода для создания полосатой зебры, один способ с помощью jQuery и один способ с помощью CSS3.

Первый метод-использование jQuery

HTML-код

чтобы создать «полосатую» таблицу, нам нужно создать таблицу с идентификатором для ее идентификации и применить стиль только к этой таблице, в этом примере мы назовем ее «zebra_triped«

в CSS

мы создаем стиль для четных строк, а другой для нечетных строк.

jQuery

наконец, нам нужно создать код jQuery, который добавит классы CSS в теги tr, это достигается с помощью этого кода:

первая строка выбирает нечетные теги tr внутри элемента с идентификатором zebra_triped и добавляет им класс «oddRow», последняя строка делает то же самое с четными строками, добавляя им класс»evenRow».

Второй метод-использование CSS

HTML-код

в CSS

—МОЗ — border-radius: 11px; и —в WebKit-границы-радиус: 11px; Здесь я определяю радиус / круглый угол для границы контейнера для каждого угла. Это только одна строка, указывающая свойство radius для всех углов, но я могу указать конкретный угол, как показано ниже:

надеюсь, это поможет,

jQuery не изменяет исходный код HTML-документа, он изменяет структуру DOM (представление документа в памяти). Чтобы увидеть эти изменения, вы должны использовать плагин браузера, который показывает DOM документа (Firebug для Firefox, Developers Tools (F12) для IE).

Источник

JQuery addClass не является функцией

Я хочу создать форму, где я показываю разные поля ввода на основе типа контакта (пользователь может выбрать тип контакта из раскрывающегося списка). Я попытался с jQuery, но у меня есть две ошибки.

1: сценарий запускается только во время второго смены. Я хочу начать с первого изменения.

2: Когда я меняю, я получил эту ошибку:

TypeError: member.removeClass не является функцией

Поскольку corporation является элементом DOM, а не узлом jQuery, и вы пытаетесь использовать на нем функцию jQuery. Оберните его в селектор jQuery, например $(corporation)

1: сценарий запускается только во время второго смены. Я хочу начать с первого изменения.

Это будет зависеть от того, как вызывается showContact . Это сложно сказать, не зная этой информации. Обратите внимание, что его следует вызывать только один раз, вероятно, когда DOM загрузился, поскольку он связывает обработчик событий.

2: Когда я меняю, я получил эту ошибку:

member , узел DOM, не имеет метода removeClass . Чтобы исправить это, вы можете сделать одно из двух:

member.classList.remove(«hidden») (использует собственный API) $(member).removeClass(«hidden») (создает объект jQuery и использует jQuery API)

Кроме того, каждый вызов сначала удаляет hidden класс, а затем добавляет его обратно. В конце концов это не будет иметь никакого эффекта.

Если вы надеялись, что класс не будет дублироваться в элементе, вам не нужно беспокоиться. И native API, и jQuery предотвратят это.

Источник

addclass не работает jquery

У меня два div, один зеленый, а другой красный. У них есть классы «зеленого» и «красного» соответственно. Когда я использую функцию addClass() (запускается нажатием на div), новый класс добавляется, а div меняет цвет. Однако, когда я нажимаю на него снова сразу, новый класс не добавляется, и div не меняет цвет.

Однако, когда я нажимаю на другой div прямо под другим, он работает и классы обновляются.

мой код Javascript:

У вас должен быть какой-то общий класс, на котором вы должны привязать этот .click и щелкнуть, просто переключая оба класса: red green

Когда вы вызываете селектор jQuery, он выбирает согласованные элементы во время выбора, и на него не влияет какое-либо изменение выбранных/невыделенных элементов после.
Теперь, если вы хотите, чтобы обработчик событий срабатывал на основе селекторов в реальном времени, вам придется использовать делегирование событий.
Который в основном прикрепляет обработчик к элементу, который будет содержать все элементы, которые вы хотите выбрать.
Также я внесла некоторые изменения в код, я не уверен, как вы хотели, чтобы он работал.

Это потому, что этот элемент не был red когда вы зарегистрировали слушателей. Вы должны делегировать мероприятие. (Зарегистрируйте родителя и проверьте event.target ). Подробнее здесь: http://api.jquery.com/on/#direct-and-delegated-events

Когда вы выполняете селектор, например $(«.red») , он находит только элементы в DOM, которые соответствуют этому селектору в этот момент времени. Он не найдет будущие элементы, которые соответствуют. Если вы хотите связать, чтобы он работал для любого элемента, который будет соответствовать в будущем, вам нужно будет изменить привязки для делегирования привязок событий.

Источник