0

私は、静的なWebページのみを提供するWebサーバーを使用する以外に選択肢がないプロジェクトに取り組んでいます。

これは(うまくいけば)一時的な解決策ですが、サイトは十分に複雑なので、各ページに埋め込むために、メニューの少なくとも一部を個別のコードに分割できる必要があります。

jQuery .load()関数を使用して解決策を見つけたと思いました。これは、1つだけをロードする場合はうまく機能しますが、2つをロードしようとすると、画像がダウンロードされていることを通知するだけで、エラーは発生しません。

これが私が使用しようとしているコードです

<!DOCTYPE html>
<html>
<head>
  <title>Test Site</title>
  <script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
  <link rel="icon" href="Graphics/Icons/favicon.ico" type="image/vnd.microsoft.icon" />
  <link rel="Shortcut Icon" href="Graphics/Icons/favicon.ico" />
  <link rel="Stylesheet" type="text/css" href="StyleSheets/Main.css" />
  <script type="text/javascript">
    $(document).ready(function () {

      $("#footer").load("WebParts/Footer.html"); 
      $("#header1").load("WebParts/Header.html");     
    });
  </script>
</head>
<body>
  <div id="header1" />
  <div id="content">
    &nbsp;
  </div>
  <div id="footer" />
</body>
</html>

WebPartsという名前の.htmlファイルを含むディレクトリがあります

footer.htmlファイルは次のようになります

 <div>HI! I'm a footer <img src="someimage.png" alt="image description" /></div>

header.htmlファイルは次のようになります

 <div>HI! I'm a header! yay look at me</div>

divの1つをロードしますが、それ以外のものを再度ロードすることはありません。

どんな助けでも大歓迎です。

4

2 に答える 2

2

あなたがしなければならないことの1つは、jQueryコードのハッシュでdivを適切にターゲットにすることです。

$("#footer").load("WebParts/Footer.html"); 
$("#header1").load("WebParts/Header.html");  
于 2013-01-11T23:58:49.747 に答える
1

私はいくつかのことに遭遇しました。うまくいけば、これが役立つ:

1)他の人が言っているように、コンテンツ<div id="content">の前に#を付けずに使用するつもりだったと思います。それが意図的なものである場合は、IDに#を使用しないことをお勧めします-人々はそれをタイプミスと混同する可能性があります

2)jQueryで、#を使用して次のようなIDを識別します。

$("#footer").load("WebParts/Footer.html"); 
$("#header1").load("WebParts/Header.html");

#なしでIDを使用している場合は、DOMでこれらの架空の要素を参照していることを意味します。

<footer>...</footer>
<header1>...</header1>

これは明らかにあなたが意図しているものではありません

3)これでコードが修正されます。それ以外の:

<div id="header1" />
  <div id="#content">
    &nbsp;
  </div>
  <div id="footer" />

使用する:

<div id="header1"></div>
  <div id="content">
    &nbsp;
  </div>
  <div id="footer"></div>

上記のコードは、IDの#を修正し、明示的に閉じられたdivタグを優先して、自己を閉じるdivタグを削除します。

2つの違いがjqueryの場合にどうなるかは完全にはわかりませんが、コードで期待される結果が得られました。うまくいけば、他の誰かがそれに光を当てることができます

于 2013-01-12T02:07:12.987 に答える