可以使用ON / OFF按钮控制刷新网页吗?

时间:2013-01-12 15:54:40

标签: jquery ajax refresh

我的页面中有一个自动刷新按钮。当我单击“自动刷新”时,页面应重新加载,而选择“自动刷新关闭”则不应重新加载。这可能吗?

这是我的自动刷新按钮功能:

$('#refresh').click(function(){
   if($('#refresh').attr('class') == 'refresh-off'){
      $('#refresh').addClass('refresh-on');
   }
    else{
      $('#refresh').removeClass('refresh-on');
   }
   });
});

3 个答案:

答案 0 :(得分:0)

是的,应该可以这样做。由于您将自己控制刷新,也许您可​​以通过向URL添加GET参数来指示自动刷新操作。这意味着当您重新加载网页时,您的脚本应该检查是否有一个名为GET的{​​{1}}参数并对其采取行动。

refresh

答案 1 :(得分:0)

尝试设置计时器,然后检查#refresh的类。如果设置,则刷新页面。

fiddle显示它以10秒的间隔工作。

var int=self.setInterval(function(){refreshPage()},10000);

$(document).ready(function() {

  var hashTag = window.location.href.split('#');
  if (hashTag[1] == 'reload') {
     $('#refresh').addClass('refresh-on').html('Refresh On');  
  }

  $('#refresh').on('click', function() { 
    $(this).toggleClass('refresh-on'); 
    if ($(this).hasClass('refresh-on'))
      $(this).html('Refresh On');
    else 
      $(this).html('Refresh Off');
  });

});

function refreshPage() {
  if ($('#refresh').hasClass('refresh-on')) {
    location.hash = 'reload';
    window.location.reload();
  } else
      location.hash = '';
}

答案 2 :(得分:0)

将计时器设置为刷新:

var timerId;
$(document).ready(function() {
    timerId = setInterval("location.reload(true)", 300000);
});

通过

清除刷新命令
clearInterval(timerId);

完整代码:

var timerId;
$('#refresh').click(function(){
   if($('#refresh').attr('class') == 'refresh-off'){
      $('#refresh').addClass('refresh-on');
      timerId = setInterval("location.reload(true)", 300000);
   }
    else{
      $('#refresh').removeClass('refresh-on');
      clearInterval(timerId);
   }
   });
});