JQuery colorbox загружает 2 фрейма

Как исправить .load()?

У меня та же проблема, и я нашел решение здесь http://groups.google.com/group/colorbox/browse_thread/thread/2f7ef7464c88f4a1/8344b1d15ca5a92b?lnk=raot

Решение состоит в том, чтобы установить этот формат: onclick="$.fn.colorbox({href:'/someurl.html', open:true}); return false;"

Просто некоторое время боролся с этой проблемой, в конце концов нашел исправление, которое сработало для меня. В моем случае у меня была ссылка, которая выглядела так:

<li>
    <a class="lightbox-lazy-iframe" data-colorbox-width="600" data-colorbox-height="600" href="PicklistEditEventTypes.aspx">Event Types</a>
</li>

и javascript для обработки щелчка следующим образом:

 jQuery(document).on('click', 'a.lightbox-lazy-iframe', function (e) {
    e.preventDefault();
    jQuery(this).colorbox({ open: true, iframe: true, width: jQuery(this).attr('data-colorbox-width'), height: jQuery(this).attr('data-colorbox-height') });
    return false;
});

Симптомы заключались в том, что первый щелчок работал нормально, но последующие щелчки приводили к более чем одному iFrame в цветовом поле с дублирующимся содержимым. Я попробовал следующие решения:

• Обновите цветовую панель
• Измените на «on» вместо «live» (пример выше показывает on после этого изменения)
• Обновите jQuery
• Вернуть false в обработчике (показано выше)
• onclick="возвратить ложь;" по ссылке
• Самостоятельное удаление iFrame перед вызовом colorbox

В конце концов, я отладил строку, в которой colorbox вызывал createElement в iFrame, и изучил стек вызовов — это показало мне, что это был собственный обработчик кликов colorbox, который перехватывал мои клики, а также мой обработчик делегатов. Кажется, что при вызове colorbox для тега привязки добавляется обработчик кликов. Это означает, что при последовательных кликах colorbox сам обрабатывает щелчок по ссылке, чтобы открыть iFrame в следующий раз, и вам не нужен вызов делегата.

Если это новый тег привязки, например. один, который вы только что создали, тогда собственный обработчик colorbox еще не привязан к этой ссылке, и требуется обработчик события делегата.

Мое решение заключается в следующем:

    jQuery(document).on('click', 'a.lightbox-lazy-iframe', function(e) {
    var $this = jQuery(this);
    if (!$this.hasClass("colorbox-initialized")) {
        e.preventDefault();
        $this.addClass("colorbox-initialized").colorbox({ open: true, iframe: true, width: jQuery(this).attr('data-colorbox-width'), height: jQuery(this).attr('data-colorbox-height') });
    }
});

Добавьте к привязке класс, указывающий, что этот код уже был запущен, и проверьте наличие этого класса в будущем. Это может быть атрибут данных, свойство самого элемента, другой атрибут и т. д. В данном случае я просто предпочитаю классы.

Проблема, по сути, сводится к двум обработчикам кликов на теге привязки, но было трудно точно определить, откуда это взялось, потому что не было очевидно, что colorbox добавляет свой собственный обработчик. Вероятно, это базовое поведение для любого тега привязки, но я полагаю, что его не следует добавлять, если установлено значение open:true.

Для меня Colorbox загрузил два iframe в одно поле при первом щелчке, без других экземпляров на странице. Я обнаружил, что простое обновление до новейших версий jQuery и Colorbox решило проблему.

У меня была аналогичная проблема, но она загружала 2 фрейма на странице, где я перемещал панель вперед и назад - на последней «странице» панели я открывал фрейм в Colorbox. Если пользователь вернется на предыдущую страницу, а затем обратно на последнюю панель, iframe будет показан дважды в Colorbox. Обратите внимание, что пользователь фактически никогда не покидает HTML-страницу, которую он загрузил в память, он просто использовал Javascript/CSS для отображения/скрытия различных частей панели по мере продвижения пользователя.

Моя проблема, которую я сужу до проблемы с некоторым AJAX, который я выполнял через jQuery, используя функцию .load() - она ​​срабатывала дважды, а функция обратного вызова была там, где был открыт Colorbox. Исправление .load(), чтобы он не срабатывал дважды, устранило мою проблему с отображением двойных фреймов в Colorbox.

Теперь... что касается того, почему Colorbox будет отображать iframe дважды, все еще немного нечетко, но я предполагаю, что без особого изучения кода Colorbox объект iframe добавляется к colorbox дважды, по одному разу для каждого Colorbox. call, а не проверять, существует ли iframe во втором вызове или просто заменяет его. У меня не было возможности вернуться и погрузиться в код Colorbox, чтобы увидеть, сделано ли это намеренно или это ошибка.

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

у меня была такая же проблема; оказалось, что это связано с тем, что я использовал .live(), перенесенный из другой части моего сайта, где ссылка cb была частью какого-то контента, сгенерированного ajax, так как это будет, но в настоящее время это не так. в данном случае cb загрузился правильно в первый раз, но дважды загрузил содержимое iframe при втором и последующих открытиях.

Я пробовал кучу вещей, в том числе явно сбрасывал свойство href ссылки перед открытием colorbox, но безуспешно. однако включение ссылки открытия cb в div и замена html для этого div в обратном вызове onClosed сделали свое дело. когда не используется .live() cb отлично работает без обратного вызова onClosed.

$('.open-colorbox').live('click', function(e) {
    e.preventDefault();
    $(this).colorbox({
        overlayClose:false, 
        returnFocus:false, 
        iframe:true,
        open:true, 
        preloading: false,
        onClosed:function(){
            $("#link-parent-div").html("");
            var linkHTML = "<a href=\"iframed-page.php\">Open</a>";
            $("#link-parent-div").html(linkHTML);
            return false;
        }
    });
    return false;
});