0

我正在使用颜色框进行模态显示，当单击图像进行更新时，它会为用户打开。一旦用户上传新图像并在颜色框模式上点击提交，模式应该关闭并刷新父页面上的图像。

我在提交按钮中使用以下 onClick 事件：

  <input onClick='window.parent.location.reload(true);' type='submit' value='Submit' name='save_button' id='save_button'>

这将关闭模式并刷新父 page.php。但是由于某种原因，它不会刷新旧图像以显示用户刚刚上传的新图像。

编辑：添加颜色框代码

调用颜色框的脚本与其他javascript代码冲突，所以我在颜色框代码上方添加了以下脚本，并将代码中的更改$为jQuery：

<script>jQuery.noConflict();
  jQuery(document).ready(function(){
  jQuery("iframe").hide();
  });

  $('input').hide();
</script>

<script>
  jQuery(document).ready(function(){
  jQuery(".iframe").colorbox({iframe:true, width:"748px", height:"92%"});
  });
</script>

有任何想法吗？

4

3 回答 3

1

浏览器会创建一个缓存以加快浏览速度，如果刷新页面后您的图像 src[location] 相同，则浏览器会向您显示图像的先前副本。您必须在每次重新加载时更改图像 src 属性的目标或通过函数执行相同操作，如下所示：

$('img').each(function(){
$(this).attr('src',$(this).attr('src')+Datetime.now());
});
于 2012-08-28T17:59:51.677 回答
1

这是特定于颜色框脚本的代码，它最终为我工作。我onClosed:function(){ location.reload(true); }在下面脚本的最后部分添加了：

<script>jQuery.noConflict();
  jQuery(document).ready(function(){
  jQuery("iframe").hide();
  });

  $('input').hide();
</script>

<script>
  jQuery(document).ready(function(){
  jQuery(".iframe").colorbox({iframe:true, width:"748px", height:"92%", onClosed:function(){ location.reload(true); } });
  });
</script>

然后我在提交按钮代码中添加了 onClick 事件：

<input type='submit' value="Submit' onClick='parent.jQuery.fn.colorbox.close();'>

这会在刷新父页面的同时关闭颜色框模式，以及所有当前版本的 FF、IE、Opera 和 Chrome 的图像。它刷新页面，但不刷新 Opera 中的图像。

于 2012-08-29T02:11:20.317 回答
0

图片很可能缓存在浏览器中，给您的图片控件一个 ID 并调用window.parent.document.getElementID("image").src += "?" + [some random number, or maybe the miliseconds];它会导致它返回服务器并重新加载图片。

编辑

更充实的脚本：

<script language="javascript" type="text/javascript">
  function onSubmitClick(){
    parent.jQuery("#img")[0].src += "?" + Math.floor(Math.random()*1001);
    //note the above will append a random number between 0 and 1000 to the src.
    parent.jQuery.colorbox.close()
  }
</script>

<input onClick='onSubmitClick();' type='submit' value='Submit' name='save_button' id='save_button'>
<img src="pic.jpg" id="img">

我还意识到我的建议中的一个失败之处是，当重新加载页面时，它只会再次从缓存中加载相同的图像。所以这个脚本是在没有页面刷新的情况下编写的。

于 2012-08-28T17:27:17.953 回答