图像缓存清除问题


Image cache clearing issue

我正在使用jquery打开弹出窗口。我的弹出内容由图像和文本组成。

当我点击 pop1 时,我会得到我的 pop1 内容。当我单击 pop2 几秒钟时,我会看到我的 pop1 内容,然后加载我的 pop2。我该如何解决这个问题?

我的弹出代码:

$(document).ready(function(){
///////LINKS - POPUP//////// 
 $('#all').delegate('a.pop-lnk', 'click', function(){
  var page = $(this).attr('id');
  $('#popup').empty();
  $('#gr-out').css({ opacity: 0.7, 'width':$(document).width(),'height':$(document).height()}).show();
  $('#popup').css({'display': 'block'});
  $('#popup').load("../phpHandler.php?page="+ page);
 })
 $('body').delegate('.hide-it', 'click', function(){ 
  $('.hide-it').hide();
    })
});

我的处理链接的 php (phpHandler):

<?php
 $page = $_GET['page'];
 $pages = array('pop1',
                'pop2');
 if (!empty($page)) {
  if(in_array($page,$pages)){
   $page .= '.php';
   require_once('../' . $page . '');
  }
  else require_once('../err.php');
 }
 else require_once('../err.php');
?>

这是因为您首先显示包含先前加载的 pop1 内容的元素

$('#gr-out').css({ opacity: 0.7, 'width':$(document).width(),'height':$(document).height()}).show();
$('#popup').css({'display': 'block'});

然后你开始加载新内容

$('#popup').load("../phpHandler.php?page="+ page);

这不是缓存,而是计时问题:)

.load回调中显示弹出窗口,以便在显示之前加载 html。

$('#popup').load("../phpHandler.php?page="+ page, function(){
    $('#popup').css({'display': 'block'});
});

当您隐藏模态时,请清除其内容。

$('body').delegate('.hide-it', 'click', function(){ 
        $('.hide-it').hide();
        $('#popup').empty();
    })
});