Jquery DOM манипулирует очень медленно в IE8, особенно addClass и removeClass

Question

У меня очень странная проблема.У меня есть вкладки и вложенные вкладки в моем html, и когда я нажимаю на вкладку / вложенную вкладку, в нее помещается класс activeContent.если я нажимаю на другую вкладку / вложенную вкладку, класс 'activeContent' удаляется из предыдущей вкладки / вложенной вкладки и помещается в текущую.Хотя этот сценарий работает нормально, когда я продолжаю нажимать на несколько вкладок / вложенных вкладок.Но в IE8 это очень медленно.Особенно, когда я нажимаю кнопку «Назад», содержимое предыдущей вложенной вкладки загружается, но активная вложенная вкладка занимает много времени, чтобы изменить свой класс.Эффект от этого заключается в том, что пока что в то время, как содержимое какой-либо другой вкладки, в то время как активная вложенная вкладка все еще является предыдущей.

Я даже пытался сначала изменить класс tab / subtab, например,

$(currentTab.node).removeClass('activeContent');
$(tab.node).addClass('activeContent');

, а затем использовал seTimeout, что-то вроде того, что приведенный выше код выполняется.*

Даже тогда вкладки / вложенные вкладки занимают много времени, чтобы изменить свой класс.

Является ли это IE8 или мне может понадобиться оптимизировать мой код.Я не уверен.Все отлично работает во всех других браузерах, включая IE6.Это как-то связано с кнопкой возврата в IE8?

Answer 1

У меня есть альтернативное решение для вас.Это событие клика по тегу привязки?Я заметил, что IE требует непомерного количества времени для отмены действия по умолчанию для тега привязки, который имеет свойство href.Особенно в IE8.

Вот пример функции с моего сайта:

function SwapLinks() { // This allows our pages to degrade gracefully. But hrefs are slow. So, if JS is enabled remove the href!
$(".playerLink").each(function (index) {
    var link = $(this).attr("href");
    if (link != undefined && link != null && link != "") {
        $(this).removeAttr("href");
        $(this).attr("link", ""); // This little number makes IE6/IE7 happy.
        $(this).attr("link", link);

    }
});

Затем вы добавили бы событие click (".playerLink"), которое обрабатывает обновление Ajax.

Answer 2

Вы вызываете этот код, когда нажимаете кнопку "Назад"? Скорее всего, кнопка возврата вызывает обновление страницы, и вы ожидаете перезагрузки всей страницы. IE8, вероятно, просто делает это поведение более очевидным, потому что кеширование содержимого страницы происходит немного по-другому.

Answer 3

У меня тоже была эта проблема, и оказалось, что это потому, что я забыл return false; из события click().(Я полагаю, что e.preventDefault() также будет работать.)

Я использовал ссылку типа <a href="#"> для своих вкладок, поскольку она нигде не перемещалась, но IE, похоже, "пытается"перемещаться и тратить на это время, поэтому возвращение false мешает навигации по-настоящему.(И, вероятно, это лучшая практика, и давайте я добавлю «настоящие» ссылки, к которым можно обратиться, что, вероятно, также является лучшей практикой.)

Это кажется особенно проблемой, когда я загружаю страницу сfile:// URL-адрес на моей машине для разработки (в отличие от развертывания его на сервере и обычного доступа к нему через HTTP).

(Спасибо Джеффу Дэвису и kd44, чьи ответы выше привели меня на правильный путь.)

Answer 4

На самом деле с моим кодом проблем не было. Я проверил на машине друзей, и она работала нормально. Затем я сбросил IE8, и все стало работать нормально. Я не уверен, почему IE8 вел себя таким образом. Это также произошло раньше, мне пришлось сбросить IE8, потому что он не распознавал приложение, работающее на сервере jboss на моем локальном компьютере, выполнив это http://my -pc: 8080 / myapp / mypage.html НО, скорее я пришлось сделать http://167.232.23.12/myapp/mypage.html, и тогда он будет отображать все. Поэтому, когда я перезагружаю браузер, я могу запустить приложение через http://my -pc: 8080 / .