1

カラーボックスは、コンテンツとして iframe をロードするための特定のメソッドを提供します。そのようなカラーボックス ポップアップが閉じられると、親ページはまったくリロードまたは更新されません。

ただし、私のユースケースでは、カラーボックスの内容を交換せずに、開いているカラーボックス内にカスタム iframe 要素を追加/追加する必要があります。すでに開いているカラーボックスのコンテンツは純粋にインライン HTML であり、iframe はまったく存在しません。この新しいカスタム iframe のコンテンツは ajax 化されたコメント フォームであり、独自のページとして読み込まれた場合、または完全に修飾された iframe 要素でのみ機能します。

iframeカラーボックスのコンテンツ内のリンクがクリックされたときに以下を追加する私の関数:

$('#cboxLoadedContent').append('<IFRAME frameborder="0" src="'+url+'" id="loadednode">');

これで問題なく動作するようになりました -IFRAMEが挿入され、コンテンツの通常の読み込みプロセスが実行され、すべてが完全に表示されます。

唯一の問題は、カラーボックス ネイティブの iframe コンテンツを終了するのとは異なり、閉じるボタンを使用するかオーバーレイをクリックして、このロードされたカラーボックスの「アウト」をクリックするとすぐに、親/トップ ページが突然リロードされることです。

これを防ぐにはどうすればよいですか？カラーボックス ネイティブの iframe を削除するとページの更新が回避されるのに、カラーボックス コンテンツに追加した iframe を削除すると親ページがリロードされるのはなぜですか?

参考までに、iframe のコンテンツであるページをカラーボックス ネイティブの iframe として読み込むことができます。終了してもページのリロードは発生しないため、どちらの場合も iframe のコンテンツに問題はありません。カラーボックスがカラーボックス処理された iframe とカラーボックス処理されていない iframe を削除する方法に注意してください。

いくつかの推測:

  • 「name」属性がない、または固定の「id」属性があると問題が発生しますか?
  • iframe が "src" 属性なしで最初のインライン HTML に含まれていたが、クリックするとその "src" パスを取得した場合、これらの問題は回避されますか?
  • 「既に存在する HTML コンテンツを削除せずに、見ているカラーボックスにこの iframe をロードする」という別の方法はありますか?

私が使用しています（Drupal 6は新しいバージョンと互換性がないため、古いバージョンです）：

4

1 に答える 1

0

解決済み：

カラーボックスで開かれた最初のコンテンツはインラインHTMLでした-カラーボックスの「インライン」コマンドを使用（非表示のコンテナからカラーボックスのコンテンツにコンテンツを移動する）。このタイプのコンテンツを含むカラーボックスが閉じられると、カラーボックスの通常の動作は、カラーボックスに手動で追加したすべてのHTMLとともにdisplay: none、元の場所（ divコンテナー）に戻すことです。

したがって、新しいHTMLを挿入した後でカラーボックスを閉じると、カラーボックスはこれらのすべてのコンテンツをページ上の非表示のコンテナーに戻しました。また、iframeを移動すると、当然、コンテンツが再読み込みされます。（額を叩く）。

したがって、実際の解決策は、カラーボックスが先に進んでHTMLコンテンツを元の場所に戻す前に、そもそもそこになかったiframeを強制的に削除（）することです。

$(document).bind('cbox_cleanup', function(){
    $('iframe').remove(); // Remove all iframes, or else colorbox inline moves them to original location with HTML content, triggering another load on it
    console.log('Done killing iFrame... moving contents back.');

わかりにくいユースケースは確かですが、誰かがiframeとインラインカラーボックスのコンテンツを混合するのに役立つことを願っています;）

于 2013-03-20T18:44:35.817 に答える