jQuery clone() and 302 image sources — how to avoid reloading in Firefox?

倖福魔咒の 提交于 2019-12-23 22:47:50

问题


I have a group of images within a <div>. All these images are served through a 302 instead of a 200 for security purposes (servlet serving image based on authentication).

I would like to clone that <div> and append it to another container.

When doing so in all browsers except Firefox, the images are not reloaded. It appears those browsers understand it's the same image.

In Firefox, each image is reloaded after the clone/append. I'd like to avoid that. Does anyone have any recommendations on how?

UPDATED with code example:

<div>
    <p><button type="button" id="btn1">Clone 1</button> <button type="button" id="btn2">Clone 2</button></p>
</div>

<div id="group1">
    <div id="imgs">
        <p><img src="https://example.com/image/9c90434ed657427dad29"></p>
        <p><img src="https://example.com/image/977b5dfe5e064880b164"></p>
        <p><img src="https://example.com/image/8f22d7fd2a2343ab99c9"></p>
        <p><img src="https://example.com/image/898c022e20b742c88ae6"></p>
        <p><img src="https://example.com/image/8319fe1d23064b5d8011"></p>
    </div>
</div>

<div id="group2"></div>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#btn1").click(function(){
            $("#imgs").clone().appendTo("#group1");
        });
        $("#btn2").click(function(){
            $("#imgs").clone().appendTo("#group2");
        });
    });
</script>

回答1:


Try adding prefetch tags for Firefox users. I believe FF still supports the prefetch relationship; they did come up with it.

<link rel="prefetch" src="https://example.com/image/9c90434ed657427dad29">
<link rel="prefetch" src="https://example.com/image/977b5dfe5e064880b164">
<link rel="prefetch" src="https://example.com/image/8f22d7fd2a2343ab99c9">
<link rel="prefetch" src="https://example.com/image/898c022e20b742c88ae6">
<link rel="prefetch" src="https://example.com/image/8319fe1d23064b5d8011">


来源:https://stackoverflow.com/questions/7590106/jquery-clone-and-302-image-sources-how-to-avoid-reloading-in-firefox

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!