2012-02-07 25 views
5

Tôi có một Ứng dụng web chạy trên bộ điều khiển (Xử lý hạn chế, bộ nhớ và băng thông mạng). Trang này về cơ bản là một tệp HTML đơn giản có đầy đủ các đèn LED cần được cập nhật trong một khoảng thời gian. Trên mỗi khoảng thời gian, Javascript gửi một yêu cầu Ajax đến máy chủ và cập nhật tất cả các đèn LED dựa trên trả lời. Bây giờ điều này hoạt động tốt!Chỉ chạy các cuộc gọi Javascript Ajax khi trang đang được xem

Sự cố là khi người dùng mở một trong các trang này và bắt đầu duyệt nội dung khác. Vì lý do bảo mật và kinh tế, chúng tôi không muốn cập nhật trang khi khách hàng không nhìn thấy trang này. Đây là thuật toán:

A flowchart of the page update algorithm

tôi phát triển mã kiểm tra nhỏ này để xem cách các sự kiện trang làm việc (see live on jsFiddle):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
<script type="text/javascript"> 
function m(msg){ 
    document.getElementById("logplace").innerHTML+=msg+"<br/>"; 
} 
</script> 
</head> 
<body onblur="m('Blur')" onerror="m('Error')" onfocus="m('Focus')" onload="m('Load')" onresize="m('Resize')" onunload="m('Unload')"> 
<span id="logplace"></span> 
</body> 
</html> 

tôi cần phải trang được chỉ cập nhật nếu người dùng hiện đang xem nó. Tôi đã tìm kiếm các Stackoverflow và các chủ đề sau đây dường như không có câu trả lời:

PS. JQuery tồn tại trên máy chủ. Nhưng nếu có một cách đơn giản hơn, tôi không muốn sử dụng JQuery.

+0

Không hỏi đúng câu hỏi. Trang này đang được xem có phải là bit chính không. Câu trả lời là khác nhau và có khả năng iffy mặc dù. Thử http://stackoverflow.com/questions/354718/detect-which-form-input-has-focus-using-javascript-or-jquery –

+0

Câu hỏi từ liên kết của bạn là về yếu tố trang có tiêu điểm. Tôi hỏi về toàn bộ trang đang được xem hay không. – AlexStack

+0

Trang là một yếu tố, do đó cùng một loại vấn đề .... –

Trả lời

0

Theo như tôi có thể thấy bạn có danh sách trang trong db của bạn. Bạn có thể thêm trường được gọi là is_viewed và cập nhật trường +1 mỗi khi người dùng truy cập trang và -1 mỗi lần anh ấy thoát khỏi trang. Vì vậy, nếu nó là == 0 bạn có thể thực hiện kiểm tra của bạn.
Tôi không thấy bất kỳ cách nào khác (không phải Ajax) để kiểm tra những gì đang diễn ra trên một trang khác. Vì vậy, bạn sẽ phải gửi yêu cầu nào

+0

đó là một giải pháp thú vị. Tôi vẫn cần phải "nghe" ngay cả khi được kích hoạt khi trang hiện tại bị "làm mờ" hoặc "đã nhập". Tôi cũng cần xử lý trường hợp đặc biệt khi người dùng đóng tab thay vì chỉ chuyển sang tab khác. – AlexStack

+0

Tôi không chắc chắn về sự kiện "blured", nhưng để đóng và để lại và nhập có sự kiện javascript – lvil

+0

Tôi đã thử chúng và cập nhật câu hỏi của tôi bằng cách sử dụng một số mã. Vẫn không giải quyết được vấn đề hoàn toàn. Xem nhận xét của tôi cho câu trả lời của Francis. – AlexStack

4
var focused = false; 

function onBlur() { 
    focused = false; 
}; 
function onFocus(){ 
    focused = true; 
}; 

if (/*@[email protected]*/false) { // check for Internet Explorer 
document.onfocusin = onFocus; 
document.onfocusout = onBlur; 
} else { 
window.onfocus = onFocus; 
window.onblur = onBlur; 
} 

Sau đó javascript của bạn có thể kiểm tra

if (focused) 
{ 
    // process ajax 
} 

nguồn: http://www.thefutureoftheweb.com/blog/detect-browser-window-focus

Kiểm tra các bản demo ông đã tạo ra để bạn có thể nhìn thấy nó trong hành động: http://www.thefutureoftheweb.com/demo/2007-05-16-detect-browser-window-focus/

Với ý nghĩ đó, nếu trang của bạn sử dụng bộ đếm thời gian để cập nhật, khi cửa sổ mất tiêu điểm, bạn có thể giết khoảng thời gian, sau đó nhấn rt lại khi cửa sổ được lấy nét.

+0

Cái này rất gần với những gì tôi muốn nhưng có một vấn đề: người dùng có hai hoặc nhiều màn hình hiển thị giữ trang web này mở trong một trong số họ và làm việc trên màn hình hiển thị khác. Trang vẫn sẽ được cập nhật ngay cả khi nó không tập trung *** nhưng vẫn hiển thị ***. Thời gian duy nhất trang không được cập nhật là khi trang không hiển thị (khi trình duyệt được thu nhỏ hoặc khi người dùng đã chuyển sang tab khác). – AlexStack

+0

Không có cách nào để javascript cho biết ngoài việc kiểm tra tiêu điểm. –

0

Tôi đề xuất rằng khi bạn khởi động cửa sổ (mà bạn muốn cập nhật chỉ khi hiển thị), bạn khởi động nó từ cửa sổ chính hoặc cửa sổ khác có tiêu điểm. Kết hợp giải pháp lấy nét của Francis và kỹ thuật sau đây, nhờ đó bạn có thể truy cập DOM của cửa sổ từ một cửa sổ khác.

Bạn có thể xem here để biết thêm thông tin. Về cơ bản, bạn sẽ sử dụng mã sau đây

var pageControl=open('page.html','page name','width=200,height=200') 

để mở trang và có thể truy cập thông qua biến số pageControl bằng javascript.

Giải quyết sự cố bằng cách cho phép bạn cập nhật trang khi cửa sổ tập trung, kiểm soát cập nhật từ cửa sổ khác hoặc từ cửa sổ chính. Chướng ngại tiềm năng duy nhất từ ​​đây sẽ là khả năng tương thích.

Giải pháp cửa sổ chính có thể liên quan nhiều hơn một chút. Nhưng nếu bạn đã làm điều này từ cửa sổ khác, bạn có thể tưởng tượng rằng nếu bạn thấy không có cửa sổ đã tập trung thì bạn sẽ không cháy các tập lệnh cập nhật .. nếu không cháy nó!

Các vấn đề liên quan