Question

我想知道是否存在只在需要时使用jQuery重新加载数据的解决方案。我目前的脚本每1秒重新加载一次，这会使网站超载我的脚本看起来像这样

var timeleft=100;

window.onload = function onLoad() {
setInterval("reloadinfo()",1000);
setInterval("updatetimer()",1);
};

function updatetimer() {
	var d = new Date();
    var n = 99-Math.round(d.getMilliseconds()/10);
	if(timeleft == 100) n = 0;
	if(n < 0) n = 0
	if(n < 10) $('#timeleft').text(timeleft+'.0'+n);
	else $('#timeleft').text(timeleft+'.'+n);
}

function reloadinfo() {
$.ajax({
	    type: "GET",
	    url: "information.php",
	}).done(function (msg) {
	    msg = $.trim(msg);
	    if (msg != '[]') {
	        var obj = jQuery.parseJSON(msg);
	        $("#lga").html('<img src="' + obj.ava + '" alt="avatar" width="115" height="115"></src>');
	        $("#lg").text("#" + obj.name);
	        $("#lgi").text(obj.age);
	        $("#lgv").text('$' + obj.school);
	        $("#lgc").text(obj.promo + '%');
	        $("#lt").text(obj.class);
	        $("#lwn").text(obj.mark);
	    }
	});
}

我想在 updatetimer（）内的 timeleft 10秒后才使用 reloadinfo（）功能。

Answer 1

你只需要像这样嵌套定时器：

var timeleft=100; 
var timer;

window.onload = function onLoad() {    
    timer = setInterval(updateTimer,1); 
}; 
function updateTimer() {    
    var d = new Date(); 
    var n = 99-Math.round(d.getMilliseconds()/10); 
    if(timeleft == 100) n = 0;  
    if(n < 0) {
        n = 0;
        clearInterval(timer);
        setTimeout(reloadInfo, 10000);
    }
    if(n < 10) 
        $('#timeleft').text(timeleft+'.0'+n);   
    else
       $('#timeleft').text(timeleft+'.'+n); 
} 

function reloadinfo() { 
    $.ajax({
         type: "GET",
         url: "information.php"
    }).done(function (msg) {
         msg = $.trim(msg);      
         if (msg != '[]') {      
              var obj = jQuery.parseJSON(msg);         
              $("#lga").html('<img src="' + obj.ava + '" alt="avatar" width="115" height="115"></src>');     
              $("#lg").text("#" + obj.name);     
              $("#lgi").text(obj.age);   
              $("#lgv").text('$' + obj.school);      
              $("#lgc").text(obj.promo + '%');   
              $("#lt").text(obj.class);      
              $("#lwn").text(obj.mark);      
         }
        timer = setInterval(updateTimer,1);
    }); 
}

这样当updateTimer中的计时器到达零时你停止倒计时，十秒钟后你调用reloadInfo，当reloadInfo完成他的http请求时，计时器将重启

仅在需要时使用jQuery重新加载数据

1 个答案: