0

jQuery Mobile を使用して複数ページのアプリを構築しており、loadPage() を使用して別のページを取得しています。

高レベルの構造は次のとおりです。

  • 着陸.html

  • /app-pages/page1.html

  • /app-pages/page2.html

  • /app-pages/page3.html

  • /shared/header.html

  • /shared/panel.html

  • /画像/

  • /css/
  • /js/core.js

core.js には、指定した複数のページに menuPanel.html と header.html をロードする JS があります。私のコードは以下の通りです。

$(document).on('pagebeforeshow', '[data-role="page"]', function(){ 
$.mobile.activePage.find('#menuPanel').load("shared/menuPanel.html", function(){ 
    $(this).parent().trigger('pagecreate');
});       
$.mobile.activePage.find('#masthead').load("shared/header.html", function(){ 
    $(this).parent().trigger('pagecreate');
});     
});

この HTML の読み込みは、landing.html では正常に機能しますが、app-pages ディレクトリの別のページに移動すると、コンソールに 404 エラーが表示され、エラーのファイル パスは "app-pages/shared/menuPanel" です。 .html" および "app-pages/shared/header.html" ファイルは相対パスを使用して検索されます。

グローバルに使用できるロード スクリプトを改善して、ページを別のディレクトリに配置しても機能するようにするにはどうすればよいですか?

panelMenu.html のリンク パスを改善するにはどうすればよいですか? 現在、相対パスを使用してコーディングされており、landing.html でのみ機能する app-pages ディレクトリを指しています。

4

1 に答える 1

0

/ (スラッシュ) を各リンクの前に置くだけで、ルート フォルダーを基準にすることができると思います。

于 2013-10-06T01:52:02.257 に答える