3

ソースが動的に入力される複数の iFrame があります。非常に多くの iframe が一度に読み込まれるため、ページが非常に遅いため、特定のイベント (各フレームの横にあるボタンが押されるなど) が発生するまで iframe が読み込まれないようにしたいと考えています。

ソースを名前フィールドに保存し、JavaScriptを使用してボタンを押したときにソースを名前と同じに設定するハックを検討しました。これが機能するかどうかはわかりませんが、とにかく汚いハックのようです。より良い解決策があるはずですか？

4

2 に答える 2

0

マークアップ aync を構築するために jquery を使用できます (イベントが発生したときに話します)。

例えば：

あなたはdivコンテナを持っています<div id"myDiv"></div>

jquery-selector を使用して、この div を取得できます。

var myDiv = $('#myDiv');

これにアクセスできるようになると、コンテンツを動的に配置できます。

var myIFrame = $('<iFrame></iFrame>');
myIFrame.attr("src", "http://myFavouriteSite.com");

これを中心に関数を作成すると、ボタンのクリックでこの関数を呼び出すことができます。

function renderAnIFrame{
  var myDiv = $('#myDiv'); //get selector

  var myIFrame = $('<iFrame></iFrame>'); //dynamicly construct an iFrame
  myIFrame.attr("src", "http://myFavouriteSite.com"); // add sourc-attribute to iFrame

  myDiv.append(myIFrame); //Interlace iFrame into Div-Container
}

これはすべて、document-ready を使用したボタン クリック イベントで発生します。

    <button type="button" id="btn-render-iFrame">
     </button>

$(document).ready(function () {
    $('#btn-render-iFrame').click(function () {
        renderAnIFrame ();
    });
});
于 2013-06-25T13:56:57.053 に答える