jQuery clone () и 302 источника изображений - как избежать перезагрузки в Firefox? - PullRequest
Новая
       12

jQuery clone () и 302 источника изображений - как избежать перезагрузки в Firefox?

3 голосов
/ 29 сентября 2011

У меня есть группа изображений в пределах <div>. Все эти изображения обслуживаются через 302 вместо 200 в целях безопасности (изображение сервлета, основанное на аутентификации).

Я бы хотел клонировать это <div> и добавить его в другой контейнер.

При этом во всех браузерах, кроме Firefox, изображения не перезагружаются. Похоже, эти браузеры понимают, что это одно и то же изображение.

В Firefox каждое изображение перезагружается после клона / добавления. Я бы хотел этого избежать. У кого-нибудь есть рекомендации как?

ОБНОВЛЕНО примером кода: 

<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 Ответ

0 голосов
/ 17 октября 2011

Попробуйте добавить теги предварительной выборки для пользователей Firefox. Я считаю, что FF все еще поддерживает отношения предварительной выборки; они придумали это. 

<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">
...