4

現在、ページのフラグメントを取得して、ブートストラップ モーダルにロードしています。

このページのフラグメントには、Google マップを読み込むために必要な jQuery が含まれていますが、モーダルがコンテンツを読み込むと、すべてのスクリプトが削除されるため、その後マップが読み込まれません。

modal-body クラス内にスクリプトを直接挿入しても、スクリプトは取り除かれます。

これに対する回避策はありますか？

モーダルをトリガーするために現在使用しているものは次のとおりです。

<a href="/stores .topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

正確に答える必要がある場合は、使用中のコードをさらに提供できます。

=== 編集: リクエストに応じて使用中のコードをさらに提供しています...

そのため、ブートストラップ モーダルをトリガーするサイト全体のリンクを含めています。モーダルをトリガーしているリンクは上で見ることができ、モーダルに関連する残りのコードは次のとおりです。

モーダルにロードしたいのは のページの一部です。この URL にロードされるすべてのコードは、ここで/stores確認できます。ただし、このページから、行 192 の .modal-container 内のすべてをロードしたいだけですが、必要なスクリプトは同じファイル内のこの div の外にあるため、モーダルでロードしようとするときにこれをキャプチャしていません。以前は、モーダル トリガーは次のようでした:-

<a href="/stores .modal-container" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

これにより、ファイル コンテンツ全体を div 内にラップし、そのコンテンツをページのフラグメントとしてモーダルで呼び出して #map_canvas をロードするために必要なスクリプトを取得できるようにしましたが、悲しいことに、すべてのスクリプトがモーダルから削除されました。 .

これにより、私たちが達成しようとしていることについて、より詳しい説明が得られることを願っています。

===編集2：実際には回避策でこれを修正しましたが、それは巨大な仕事だったので、できるだけ早く回答を投稿します...

4

2 に答える 2

0

次のコードを使用して、boostrap modal にビューをロードしています。

 $('[data-toggle="modal"]').click(function(e) {
            e.preventDefault();
            var url = $(this).attr('href');
            if (url.indexOf('#') == 0) {
                $(url).modal('open');
            } else {
                $.get(url, function(data) {
                    $(data).modal();
                }).success(function() { $('input:text:visible:first').focus(); });
            }
        });

次のトリガーを使用:

<a href="new" role="button" data-backdrop="static" data-keyboard="false" class="btn btn-success" rel="tooltip" data-placement="top" title="text here" data-toggle="modal" alt="text here"><i class="icon-plus icon-white"></i> </a>

このメソッドを使用すると、モーダルが表示されるときにすべてのスクリプトが確実に読み込まれます。これは、モーダルを正しく表示することがわかった唯一の回避策です。

フォーム ( new.html ) に表示する必要があるものはすべて完全に表示されます。

Google Mapしたがって、関連するすべてのコードをに対応するページに配置することをお勧めします/stores。

編集 トリガーは次のようにする必要があります：

<a href="/stores" class="topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>

それ以外の ：

<a href="/stores .topclass" data-target="#StoresModal" data-toggle="modal">Launch demo modal</a>`

編集2

私が見る問題は、モーダル インクルージョンが JS ファイルを取得できないことです。これは、JS ファイルがインクルード セクション内にないためです。私は PHP の専門家ではありませんが、次のオプションを試してみてください。

オプション 1 (あまりきれいではない)

<script>Google Map required JS File</script>内にタグを追加でき<div class="modal-container"></div>ますが、同じ JS ファイルに対して重複したタグが取得されます。

Option2 (可能でしょうか?)

新しいファイルを作成<div class="modal-container"></div>し、必要な JS ファイルを含むセクションを追加します。

新しいファイルを含めることで 192 行目を置き換え、モーダルに情報を表示するために現在のストア オブジェクトを渡してモーダルを呼び出します。

その助けがあれば教えてください。

于 2013-07-17T13:51:44.633 に答える