0

ユーザーがリンクを押したときにページを div にロードしようとしています。ただし、開発コンソール (Chrome) では、次のエラーが表示されます。

Uncaught TypeError: undefined is not a function
(anonymous function)

私のHTML：

<!DOCTYPE html> 
<html lang="en"> 
  <head> 
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="CSS/common.css" />
    <script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.2/dojo/dojo.js" data-dojo-config="async:true, parseOnLoad:true"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script src="JS/common.js"></script>
    <script src="JS/DyContent.js"></script>
    <title></title>
  </head>
  <body>
    <div id="bannerColor"></div>
    <div id="imgNav">
      <img id="banner" src="Images/logoLast.jpg"/> 
      <ul id="nav">
        <li class="current"><a "View/index.php">Home</a></li>
        <li><a href="#About">About Us</a></li>
        <li><a href="#Login">Login/Register</a>
          <ul>
            <li><a href="#Add">Add/Remove Car</a></li>
            <li><a href="#Search">Serach Invoices</a></li>
            <li><a href="#Book">Book Service</a></li>
          </ul>
        </li>
        <li><a href="#Gallery">Gallery</a></li>
        <li><a href="#Contact" id="Contact">Contact Us</a></li>
      </ul>
    </div>
    <div id="centerPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div>
  </body>
</html>

私のJQueryファイル：

$(document).ready(function () {
  $('#Contact').click(function () {
    $('#centerPane').load('External/map.php');
  });
});

ロードしようとしているページ (map.php):

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="/CSS/common.css" />
    <script src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script type="text/javascript" src="/JS/location.js"></script>
    <title></title>
  </head>
  <body>
    <header></header>
    <div id="mapContainer"></div>
    <div id="writtenDir"></div>
   <footer></footer>
  </body>
</html>

エラーの原因であり、div への入力を許可していないのは何ですか?

編集：

<link rel="stylesheet" type="text/css" href="http://scmweb.infj.ulst.ac.uk/~B00518833/DNA/View/CSS/common.css" />
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="http://scmweb.infj.ulst.ac.uk/~B00518833/DNA/View/JS/location.js"></script>
<div id="mapContainer"></div>
<div id="writtenDir"></div>
4

2 に答える 2

1

すべてのコメントを1つの回答として統合します。

これは、他のjavascriptライブラリもあることが原因である可能性があります。「未定義は関数ではありません」というエラーは、通常、名前空間の競合の場合にスローされます。まず、onclickハンドラーが呼び出されているかどうかを確認します-これにより、jqueryが正常に機能していることが確認されます。

呼び出される場合は、load（）関数呼び出しでもコールバック関数を関連付けます。データが受信されたかどうかを確認します。または、firebugでネットワーク呼び出しを確認します。

これも正常に機能している場合は、メインページ自体の一部としてCSSリンクを含めます。スクリプトについては、メインファイル自体にリンクしてください。これが不可能な場合は、応答の一部として存在するスクリプトを自分で評価する必要があります。Jquery応答（スクリプトタグ付きのHTMLページ）をDOMにロードする方法を参照してください（または）jquery.getScript（）を使用してスクリプトを評価してください。最初に基本的なHTMLコンテンツを読み込んでから、インタラクティブな要素を取り込んでみてください

于 2013-02-06T22:34:27.177 に答える
0

私が最初に試みることは、map.js を編集して、完全な html ページではなく必要なものだけが含まれるようにすることです。

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="/JS/location.js"></script>

<header></header>
<div id="mapContainer"></div>
<div id="writtenDir"></div>
<footer></footer>

あなたのようにファイルをロードすると、ドキュメントに次のようなものが含まれることになります。

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
        [....]
        <title></title>
    </head>
    <body>
        <div id="centerPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
            <!DOCTYPE html> 
            <html lang="en"> 
               <head>[...]</head>
               <body>[...]</body>
            </html>
        </div>
    </body>
</html>

これは明らかに有効な html ではなく、スクリプト エラーが発生する可能性があります...

編集

Colin が指摘したように、余分な doctype と html を削除しようとしましたが (22 のコメントすべてを読んだわけではありません)、まったく別のエラーが発生しました:

@Badaboooooom I then get the following error. Uncaught TypeError: Cannot read property 'offsetWidth' of null – Colin747 58 mins ago

これはおそらくまったく別の問題です。他のコードが実行されました。

最初に map.js の doctypes とすべてのスクリプトを削除してから、スクリプト機能を 1 つずつ追加してデバッグします。

于 2013-02-06T22:15:02.860 に答える