0

外部ファイルからコンテナ div に (ajax を使用して) アセットをロードしたいと考えています。これらは、次のようなオブジェクトの json リストで参照されます。

  "pages": {
    "page1": {
      "html": "markup/page1.html",
      "css": "style/css/pages/page1.css",
      "js": "scripts/pages/page1.js"
    },
    "page2": {
      "html": "markup/page2.html",
      "css": "style/css/page2.css",
      "js": "scripts/page2.js"
    },

  }

基本的にこれは、ユーザーが [次へ] をクリックして次のスライド/ページに移動できる美化されたスライド ショーです。しかし、各要素をロードするのに苦労しており、関連するアセットがあり、jquery を使用してハッシュを変更しています。

よろしくお願いいたします。

4

1 に答える 1

0

まず、html に css ファイルと js ファイルを直接インクルードして、1 つのファイルのみを処理する必要があるようにします。

第二に、次のいずれかを行うことができます...

コンテナー div に iframe を使用し、それをロードします

$("#container").attr('src', url);

ajax 呼び出しを使用してコンテンツを取得し、そのように div に配置します...

$.ajax({
        type: "GET",
        url: url,
        dataType: "html",
        success: function(html) {
            $("#container").html(html);

        },
        error:function (xhr, ajaxOptions, thrownError){
                    alert("Failed to load page!\n" + xhr.status + "\n" + thrownError);
        }
    });

すべての css および js ファイルが事前に読み込まれている場合は、2 番目のオプションを使用する方が適切ですが、それらを個別に読み込んでいて競合する可能性がある場合は、div を変更するとは思わないため、iframe を使用する方が安全な方法です。 HTML は、不要になった css または js ファイルをアンロードします。

于 2013-01-31T07:02:28.920 に答える