Kann nicht bekommen Ereignis Javascript Timeout

Question

Ich habe eine onClick Funktion, die Boxen auf und abseits der Webseite zu bewegen funktioniert auszuführen, wenn der Bildschirm geklickt wird. Ich versuche, diesen Code so zu konvertieren, dass die Bewegung automatisch alle vier Sekunden erfolgt. Das Problem ist, dass das Timeout-Ereignis höchstwahrscheinlich innerhalb der Hauptfunktion stattfinden muss, weil die Funktionen bereits repetitiv sind, und da stehe ich fest.

Dies ist der Arbeitscode:

<script> 

    $('.box').click(function() { 
     $('.box').each(function() { 
     if ($(this).offset().left < 0) { 
      $(this).css("left", "150%"); 
     } 
    }); 

    $(this).animate({ 
     left: '-56%' 
    }, 500); 

    if ($(this).next().size() > 0) { 
     $(this).next().animate({ 
      left: '50%' 
     }, 500); 
    } else { 
     $(this).prevAll().last().animate({ 
      left: '50%' 
     }, 500); 
    } 
    }); 

</script> 

Und das ist, was ich für den Timeout versucht haben:

<script> 

    window.onload = function(){ 
     setTimeout(boxMove, 1000); 
    }; 

    function boxMove() { 

    $('.box').each(function() { 
     if ($(this).offset().left < 0) { 
      $(this).css("left", "150%"); 
     } 
    }); 

    $(this).animate({ 
     left: '-56%' 
    }, 500); 

    if ($(this).next().size() > 0) { 
     $(this).next().animate({ 
      left: '50%' 
     }, 500); 
    } else { 
     $(this).prevAll().last().animate({ 
      left: '50%' 
     }, 500); 
    } 

} 

</script> 

Answer 1

Um sicherzustellen, dass ich richtig bin zu verstehen, Sie wollen nicht länger den Klick Um dieses Kästchen zu löschen, soll es jedoch automatisch 4 Sekunden nach dem Laden der Seite gelöscht werden.

Der Code ist in der Nähe, es sieht aus wie Sie einige abschließende Klammern verpasst, wenn Sie den Code zu konvertieren. Versuchen Sie folgendes:

window.onload = function(){ 
    setTimeout(boxMove, 1000); 
}; 

function boxMove() { 
    $('.box').each(function() { 
     if ($(this).offset().left < 0) { 
      $(this).css("left", "150%"); 
     } 
     $(this).animate({ 
      left: '-56%' 
     }, 500); 

     if ($(this).next().size() > 0) { 
      $(this).next().animate({ 
       left: '50%' 
      }, 500); 
     } else { 
      $(this).prevAll().last().animate({ 
       left: '50%' 
      }, 500); 
     } 
    }); 
} 

Annahmen:

1. Ihre DOM-Manipulation mit jQuery funktioniert wurde, wie Sie es erwarten bis jetzt vor einem Timeout zu konvertieren.
2. Sie müssen diese Felder nur einmal löschen und sie kehren nie zurück. Wenn sie zurückkehren und Sie sie regelmäßig alle 4 Sekunden löschen möchten, ändern Sie setTimeout in setInterval.