2012-05-09 1 views
1

X 분 후 DIV 새로 고침을 시작JQuery와 정지/I는 사업부에서 페이지와 refeshes 4 초마다로드 작은의 jQuery chatbox를 작성했습니다

을 이것은 그러나 내가 추측하고있어
$('#toggle').click(function() { 
    $('#sbox').slideDown('fast'); 
    var refreshId = setInterval(function() { 
     $('#shout').load('shout.php?randval='+ Math.random()); 
    }, 4000); 
    return false; 
}); 

내가 발견

... 자원 드레 이너의 비트가 너무 활동이 상쾌 정지를 감지되지 않고 한 번 활동이 다시가 새로 고침을 다시 시작할 경우 어떻게 엑스 분에 대한 생각입니다 이 스 니펫은 ... https://stackoverflow.com/a/7026769/1359310 ... 활동 (마우스 움직임)을 확인하고 내 필요를 완벽하게 보이지만 두 가지를 결합 할 수는 없습니다.

div에서 클릭로드 페이지에있는 내용을 요약하면 x 분 후에 활동이 없으면 새로 고침이 중지되고 활동이 다시 감지되면 다시 새로 고침을 시작합니다.

답변

1

이렇게해야합니다. 당신은 당신의 필요에 적응할 수 있어야합니다. 나는 본질적으로 당신이 링크 한 SO 문제의 코드를 복사했다. 이렇게하면 활성/비활성 클래스가 본문에 추가됩니다. 내 코드를 실행할 때 이것을 볼 수 있습니다. 페이지가 활성화되면 화면이 파란색입니다. 이는 새로 고침이 수행되었음을 나타냅니다. 화면이 회색이면 상쾌하게하지 마십시오.

그런 다음 코드에 활성/비활성 클래스 검사를 입력하면됩니다.

http://jsfiddle.net/scgEs/1

var refreshrate = 4000; 
var inactivitytime = 15000; 
var refreshid; //set to global scope so that you can clear it later 
var activityTimeoutId; //store timeout for inactivity 
$('#sbox').slideUp(); 

$('#toggle').click(function() { 
    $('#sbox').slideDown('fast'); 
    refreshId = setInterval(function() { 
     if ($('body.inactive').length == 1) { 
      $('#sbox').append('<div>No refresh</div>'); 
     } 
     else { 
      console.log('Refreshing data'); 
      $('#sbox').append('<div>Refreshed...</div>'); 
      //$('#shout').load('shout.php?randval=' + Math.random()); 
     } 
    }, refreshrate); 
    return false; 
}); 

// If theres no activity for X seconds do something 
activityTimeoutId = setTimeout(inActive, inactivitytime); 

function resetActive() { 
    $(document.body).attr('class', 'active'); 
    clearTimeout(activityTimeoutId); 
    activityTimeoutId = setTimeout(inActive, inactivitytime); 
} 

// No activity do something. 


function inActive() { 
    $(document.body).attr('class', 'inactive'); 
} 

// Check for mousemove, could add other events here such as checking for key presses ect. 
$(document).bind('mousemove', function() { 
    resetActive() 
});​ 
+0

방금 ​​내 대답을 업데이트했습니다. 내 변수를 대체하는 것을 잊었습니다. – mrtsherman

+0

감사합니다 mrtsherman, 내 자신의 요구 (분명히)에 맞게 조정할 필요가 있었지만 응답으로 표시된 것은 잘 작동합니다.) –

1
// If theres no activity for 2 minutes do something 
var isActive = true; 
var isRefreshing = false; 
var refreshChatboxWait = 4000; 
var activityTimoutWait = 120000; 
var activityTimeout = setTimeout(inactive, activityTimoutWait); 

function resetActive(){ 
    isActive = true; 
    clearTimeout(activityTimeout); 
    if (! isRefreshing) { 
     var refreshId = setInterval(refreshChatbox, refreshChatboxWait); 
    } 
    activityTimeout = setTimeout(inactive, activityTimoutWait); 
} 

// No activity do something. 
function inactive(){ 
    isActive = false; 
} 

function refreshChatbox(){ 
    $('#shout').load('shout.php?randval='+ Math.random()); 
    if (! isActive) { 
     clearInterval(refreshId); 
    } 
} 

// Check for mousemove, could add other events here such as checking for key presses ect. 
$(document).bind('mousemove', function(){resetActive()}); 

$('#toggle').click(function() { 
    $('#sbox').slideDown('fast'); 
    if (! isRefreshing) { 
     var refreshId = setInterval(refreshChatbox, refreshChatboxWait); 
    } 
    return false; 
}); 

시도해보십시오. :)

+0

덕분에 - 편집을했다. 그건 단지해야 할 일입니다. :) –

+0

나에게 좋은 것처럼 보입니다. – mrtsherman

+0

내가 원하지만, 주요 페이지 로딩 지연을 가져오고 브라우저 (FireFox)뿐 아니라 내 페이지에서 모든 탭을 열 때, 때때로 FF 프로세스를 죽일 태스크 관리자를 열어야하는 경우도 있습니다. ( –