Chạy một hàm trong khoảng thời gian trong jQuery

Question

Tôi muốn tạo biểu ngữ bằng cách sử dụng jQuery. Khi tập lệnh được tải trang sẽ hiển thị một nhóm ảnh từng người một. Ví dụ, bộ điều khiển gửi 10 hình ảnh và mỗi bức ảnh sẽ được hiển thị trong 30 giây sau 10 phút kịch bản yêu cầu một bức ảnh khác từ bộ điều khiển.

Câu hỏi đặt ra là: Làm thế nào tôi có thể thực hiện một chức năng chạy trong 30 giây. Tôi cần phải chạy một chức năng trong một khoảng thời gian mà không cần bất kỳ nút bấm hoặc bất cứ điều gì khác.

Answer 1

Phương pháp chính là:

setInterval(function() { 
     console.log('it works' + new Date()); 
    },30000); 

Nếu bạn cần để xóa khoảng thời gian trong tương lai:

var myInterval = setInterval(function() { 
      console.log('it works' + new Date()); 
     },30000); 

trong tương lai:

clearInterval(myInterval); 

Answer 2

Bạn nên sử dụng setInterval như

này

setInterval("alert('Hello')", 5000); 

Answer 3

JavaScript cung cấp một setTimeout function:

var timeoutID = window.setTimeout(code, delay); 

Answer 4

Hãy thử một cái gì đó như thế này:

HTML:

<ul id="ticker"> 
    <li>Image 1</li> 
    <li>Image 2</li> 
    <li>Image 3</li> 
    <li>Image 4</li> 
    <li>Image 5</li> 
</ul>​ 

CSS:

ul{height:20px; overflow:auto}​ 

JS:

var $ticker = $('ul#ticker'); 
var speed = 300; 
var pause = 3000; 

var tick = function() { 
    var first = $ticker.find('li').first().animate({ 
     height: 0 
    }, speed).hide('normal', function() { 
     $(this).remove(); 
     $ticker.append('<li>' + first + '</li>'); 
    }).html(); 
}; 

$('ul#ticker').click(tick); 
setInterval(tick, pause); 

Ở đây, một đơn giản Demo.