Thực thi hàm vô hạn jQuery

Question

Chúng tôi muốn biết liệu có thể có một hàm bằng cách sử dụng jQuery để kiểm tra một số phần tử hay không, tùy thuộc vào loại được gán cho chúng bằng một cú nhấp chuột, thực hiện các chức năng khác. Về cơ bản, một hàm sẽ chạy mãi mãi, trong khi người dùng không làm mới trang.

Ý tưởng không phụ thuộc vào các nhấp chuột sự kiện để thực hiện chức năng, nhưng các lớp được gán cho một phần tử cụ thể.

Ví dụ:

$("td.gantt").each(function() { 
    if($(this).hasClass("oper")) { 
     //execute a serie of functions 
    } 
    if($(this).hasClass("preop")) { 
     //execute a serie of functions 
    } 
}); 

Trên đây được thực hiện một lần, và chúng ta cần phải chạy tất cả các thời gian.

Answer 1

// define a function... 
function ganttEach() { 
    $("td.gantt").each(function() { 
    // ... 
    }); 
} 

// ...repeat it once every second 
window.setInterval(ganttEach, 1000); 

Bạn không thể "để cho nó chạy tất cả các thời gian" (như, trong một vòng lặp while(true)) vì JavaScript đơn luồng và ngăn chặn các chủ đề có nghĩa là mã khác của bạn sẽ không bao giờ chạy. setInterval() đảm bảo có "khoảng trống" cần thiết cho các mã khác để thực thi.

setInterval() trả về ID mà bạn có thể lưu trữ trong một biến và cấp nguồn cho clearInterval() tại một số thời điểm để làm cho nó dừng lại.

---

Nếu bạn muốn chắc chắn rằng mỗi lần lặp mới của chức năng của bạn chỉ bắt đầu sau trước đó đã thực sự hoàn tất, sử dụng setTimeout() thay vì:

// define a self-repeating function... 
function ganttEach() { 
    $("td.gantt").each(function() { 
    // ... 
    }); 
    window.setTimeout(ganttEach, 1000); // calls itself again in one second 
} 

// ...initiate self-repeating function 
ganttEach(); 

Bạn có lẽ nên bao gồm một số cách để dừng lặp lại vô tận tại đây, như giới thiệu cờ được kiểm tra trước cuộc gọi setTimeout().

Answer 2

Tôi không chắc chắn chính xác những gì bạn đang cố gắng làm, nhưng bạn đã thử setInterval chưa? Nó sẽ tiếp tục chạy nếu đó là những gì bạn thực sự muốn.

Answer 3

Có thể, với setInterval. Lời khuyên của tôi là chọn phần tử bên ngoài chức năng lặp lại để giảm thiểu chi phí.

Vòng lặp vô hạn sẽ khóa giao diện người dùng trình duyệt, vì đây là một môi trường đơn luồng. Đặt khoảng thời gian, tuy nhiên cho phép bạn thêm hành động vào ngăn xếp giao diện người dùng sẽ được thực hiện sau một khoảng thời gian nhất định. Bạn có thể chỉ định khoảng thời gian này trong thông số thứ hai thứ hai của setInterval.

// select the element outside 
// to minimize overhead 
$gantt = $("td.gantt"); 

// define a repeating action 
setInterval(function() { 
    $gantt.each(function() { 
     if($(this).hasClass("oper")) { 
      //execute a serie of functions 
     } 
     if($(this).hasClass("preop")) { 
      //execute a serie of functions 
     } 
    }); 
}, 100); // repeat interval: 100ms 

Answer 4

Bạn có thể chạy kiểm tra của bạn mỗi vài mili giây, nói 50ms, sử dụng setInterval

window.setInterval (function() { 
    // do checks here 
}, 50); 

Bạn có thể kết thúc sử dụng rất nhiều sức mạnh của CPU nếu séc của bạn quá thường xuyên, hoặc quá phức tạp.