Метод jQuery UI switchClass() не работает должным образом

ProgramBox

Метод jQuery UI switchClass() не работает должным образом

Post author:admin
Запись опубликована:3 сентября, 2022
Post category:Вопросы по программированию

#javascript #jquery #css

Вопрос:

switchClass() Метод jQuery UI не переключает класс, скорее он выполняет некоторые нежелательные анимации, и класс остается таким же, как и исходный, когда я использую jquery.animate-enhanced.js для анимации с аппаратным ускорением.
Есть идеи о том, как я могу это исправить?

1. и почему он не работает должным образом? можете ли вы, по крайней мере, объяснить поведение «не работает должным образом»?

2. он не переключает класс. После некоторой нежелательной анимации класс остается прежним.

3. Не могли бы вы опубликовать jsfiddle, который повторяет проблему?

4. в браузере перейдите на вкладку сети в отладчике браузера (F12) и убедитесь, что загрузка css и js прошла успешно. если нет, добавьте http в начале ссылки href

Ответ №1:

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

Я до сих пор не знаю, почему switchClass иногда не работает, но у меня есть обходной путь:

Заменить

 switchClass('circle','square');

 addClass('square').removeClass('circle');

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

Ответ №2:

 $(function(){
   $('#circle').click(function(){
      $('.circle').switchClass('circle', 'square', 'slow');
      $('.square').switchClass('square', 'circle', 'slow');
      return: false
   });  
});

В этом примере при нажатии на Div #circle я удаляю класс .circle из всех объектов и заменяю его классом .square . Если класс .circle не подлежит удалению, то класс .square удаляется и заменяется классом .circle . Это эффект переключения.

Если вы не хотите, чтобы переключатель просто удалял верхний или нижний.

Ответ №3:

если prb

.switchClass не является функцией

проверьте, правильно ли вы связываете effects.core.js в вашем коде

проверьте это, используя консоль в вашем навигаторе для js, удачи, у меня все работает нормально 🙂

1. да, я уже знаю, но взгляните: http://api.jqueryui.com/category/effects-core «Функциональность, предоставляемая effect.js . В дополнение к методам, перечисленным ниже, effect.js также включает в себя несколько послаблений «.

Ответ №4:

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

  //first you start with one of the classes in html:
    <div class="foo"></div>
    //then in js you do:
    var element = ...;
    $(element).toggleClass('foo bar');

Это переключит как ‘foo’, так и ‘bar’. Поскольку foo уже присутствует, он удалит его и добавит bar . При следующем вызове будет присутствовать панель вызовов, поэтому я удалю ее и добавлю foo. И так далее.

Если что-то непонятно, вот пример jsfiddle: https://jsfiddle.net/09qs86kr/1 /

Ответ №5:

пожалуйста, проверьте, добавлен ли файл jQueryUI

 <script type="text/javascript" src="https://code.jquery.com/ui/1.8.23/jquery-ui.min.js"></script>

Ответ №6:

Я сталкивался с этой проблемой раньше, но не мог найти решение. Затем я использовал toggleClass() для решения проблемы. Вот пример:

Если элемент имеет класс X в начале, то напишите:

 $(element).toggleClass("Y");

Это добавит класс Y. Если вы сделаете это снова, это приведет к удалению класса Y.

Ссылка: http://api.jquery.com/toggleclass /

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

Ответ №7:

Убедитесь, что используемые вами классы не имеют никаких свойств «!important». Я вложил средства и обнаружил, что класс jquery UI switch не работает для свойств с тегами «!important».

Причина : учтите, что ваш предыдущий класс имел стиль «padding : 0», а ваш новый класс имеет «padding: 100». Вы добавили длительность switchClass на 100 мс. Для этого jquery добавит стиль вашему элементу, увеличивая отступ на «1» каждые 1 мс. Но, поскольку предыдущий класс все еще присутствует в элементе с «заполнением: 0!важно», через 10 мс стиль «заполнение : 10», добавленный jquery, не влияет на пользовательский интерфейс. Через 100 мс jquery выполнит removeClass(«previousClass») и addClass(«NewClass»). это приведет к мгновенному изменению стиля, отраженного в пользовательском интерфейсе.

Это объяснение, которое я нахожу. Пожалуйста, дайте мне знать, что вы, ребята, думаете об этом.

Метки: Метод jQuery UI switchClass() не работает должным образом