Задержка удаления класса в JQuery

Возможный дубликат:
Выполнение задержки JQuery script

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

Я думал, что этот код может сделать это:

<script type="text/javascript">
$(document).ready(function () {


        $("#rowone.one").addClass("pageLoad");
        $("#rowtwo.three").addClass("pageLoad");
        $("#rowthree.two").addClass("pageLoad");

        .delay(800);    
        $("#rowone.one").removeClass("pageLoad");
        $("#rowtwo.three").removeClass("pageLoad");
        $("#rowthree.two").removeClass("pageLoad");

})
</script>

К сожалению, это не так, любая помощь будет высоко оценена. Заранее спасибо.

Ответ 1

Вы можете использовать setTimeout():

Вызывает функцию или выполняет фрагмент кода после указанной задержки.

$(document).ready(function () {
   var $rows = $("#rowone.one, #rowtwo.three, #rowthree.two").addClass("pageLoad");

   setTimeout(function() {
       $rows.removeClass("pageLoad");
   }, 800);
});

Ответ 2

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

.delay() предназначен только для работы с анимацией. Вам придется прибегнуть к использованию регулярных setTimeouts для того, что вы делаете:

надеюсь, что это соответствует вашим потребностям :)

код

 $("#rowone.one, #rowtwo.three, #rowthree.two").addClass("pageLoad");

 setTimeout(function () {      
         $("#rowone.one, #rowtwo.three, #rowthree.two").removeClass("pageLoad");         
}, 800);

Ответ 3

Используйте setTimeout для этого.

setTimeout(function() {
 $("#rowone.one").removeClass("pageLoad");
 $("#rowtwo.three").removeClass("pageLoad");
 $("#rowthree.two").removeClass("pageLoad");
}, 800);

Ответ 4

Оберните его в функцию и передайте состояние, например:

$(document).ready(function () {
    doClasses('add');
    setTimeout(function() { doClasses('remove'); }, 800)

    function doClasses(state) {
        $("#rowone.one, #rowtwo.three, #rowthree.two")[state+'Class']("pageLoad");
    }
});

FIDDLE

Теперь его легко вызвать, и проще вставить время, а вы не повторяете код.

Ответ 5

Я удалил селектора классов: .one .three . two и добавил функцию тайм-аута. должен работать.

<head>
<style type="text/css">
.pageLoad{color:red;}
</style>


<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>



<body>
<div id="rowone">rowone</div>
<div id="rowtwo">rowtwo</div>
<div id="rowthree">rowthree</div>



<script type="text/javascript">
$(document).ready(function () {


        $("#rowone").addClass("pageLoad");
        $("#rowtwo").addClass("pageLoad");
        $("#rowthree").addClass("pageLoad");




})

 function removeC(){
$("#rowone").removeClass("pageLoad");
        $("#rowtwo").removeClass("pageLoad");
        $("#rowthree").removeClass("pageLoad");
}

setInterval(removeC, 5000);


</script>
</body>

код >