hasClass не работает, когда страница обновляется

Я пытаюсь сказать, если body имеет класс x для добавления x класса.hasClass не работает, когда страница обновляется

Javascript

$('body').toggleClass('projectLoaded'); 
$('[data-type="projectLoader"]').click(function() { 
    var proj = $(this)[0].getAttribute('data-project'); 
    $('#arrow-nav').addClass('slideIn'); 

    updateHash(proj); 
    return false; 
}); 
$('[data-type="projectDie"]').click(function() { 

    $('body').removeClass('projectLoaded'); 
    $('#arrow-nav').removeClass('slideIn'); 
    return false; 
}); 

if ($('body').hasClass('projectLoaded')) { 
    $('#arrow-nav').addClass('slideIn'); 
} else { 
    $('#arrow-nav').removeClass('slideIn'); 
}

Когда projectLoaded срабатывает, то addClass делает работу slideIn, но когда я обновить, даже если projectLoaded активен, addClass исчезает. Я думал, что hasClass будет работать, но это не так. Все работает, но просто обновляется, и оно исчезает.

Рабочая страница here, щелкните проект, и вы будете #arrow-nav.slideIn, но обновите и не получите .slideIn.

UPDATE Это то, что работает для меня:

$('document').ready(function() { 
     if ($('body').hasClass('projectLoaded')) { 
      $('#arrow-nav').addClass('slideIn'); 
     } else { 
      $('#arrow-nav').removeClass('slideIn'); 
     } 
});

или

$('body.projectLoaded').ready(function() { 
    $('#arrow-nav').addClass('slideIn'); 
});

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

источник

2016-05-18 Darren Bachan

Вы пробовали поместить код внутри функции document.ready()? – ssilas777

Можете ли вы показать нам какой-то рабочий код, чтобы его было легче отлаживать. – Shrabanee

Некоторые HTML, некоторые HTML, мое королевство для некоторых HTML! – Jhecht

проверки готовности следующим образом может помочь

$(document).ready(function() { 
    console.log("ready!"); 
    $('body').toggleClass('projectLoaded'); 
});

Мой инстинкт подсказывает мне, что это будет работать, но не испытали это.

$('body').ready(function() { 
    console.log("ready!"); 
    $('body').toggleClass('projectLoaded'); 
});

источник

2016-05-18 04:58:37 Cyberience

Оба работали нормально, так как я не был уверен в 'body ready function', поэтому я создал [jsFiddle здесь] (https://jsfiddle.net/ fxavrws0 /), чтобы проверить его и его работоспособность. –

@Kirankumar Если я это сделаю и обмениваю оповещение для addClass, когда на главной странице, где .projectLoaded больше не находится на теле, он по-прежнему остается. Обновление не удаляется класс –

Возможно ли, что здесь происходит двойной вызов, у меня был подобный опыт, и, добавив unbind в вызов щелчка, исправлена проблема. $ ('[data-type = "projectDie"]') .unbind ('щелчок'). кли ck (function() {...} – Cyberience

$ ('тело'). ToggleClass ('projectLoaded') дается с в функции loadProject(), который выполняется после того, как условие hasClass проверяется. Поэтому перед добавлением класса 'projectLoaded' в тело исключается условие hasClass, поэтому класс 'SlideIn' не добавляется. Попробуйте этот оператор '$ (' body '). ToggleClass (' projectLoaded ')' в документе готов, как и выше. Это будет работать.

источник

2016-05-18 06:01:20 Arden

Все предлагают это, сайт ломается, когда я это делаю. Это выполняется .projectLoaded сразу, и его нужно только добавить во время события click на .projectLoader. –

hasClass не работает, когда страница обновляется

ответ

Смежные вопросы