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

Question

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

Answer 1

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

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

Заменить

switchClass('circle','square');

на

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

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

Answer 2

, если значение prb

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

, проверьте, если вы ссылаетесь на effect.core.js в вашемcode

проверьте, что с помощью консоли в вашем навигаторе для js, удачи, у меня все работает нормально:)

Answer 3

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

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

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

Answer 4

проверьте, добавлен ли файл jQueryUi

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

Answer 5

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

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

Answer 6

Полагаю, вы хотите переключаться между двумя классами.В этом случае вы можете сделать это с помощью функции 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 уже присутствует, он удалит его и добавит панель.На следующей панели вызовов будет присутствовать, поэтому я удалю его и добавлю foo.И так далее.

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

Answer 7

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

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

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

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

Справка: http://api.jquery.com/toggleclass/

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