2012-01-16 8 views
81

が定義されていない私は自分のサイト上でいくつかのJavaScriptを実装しているが、私は次のエラーメッセージを取得しておいてください。キャッチされていないにReferenceError:jQueryのは

Uncaught ReferenceError: jQuery is not defined

Uncaught SyntaxError: Unexpected token <

これは私が使用していることのJavaScriptですheader.php:

<script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.jcarousel.min.js"></script> 
    <script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.scrollTo.js"></script> 
    <script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.backgroundPosition.js"></script> 
    <script type="text/javascript" src="/test/wp-content/themes/child/script/scripts.js"></script> 
    <script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.cycle.lite.js"></script> 
    <script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.accordian.js"></script> 

    <script type="text/javascript"> 
     jQuery(document).ready(function() { 
      jQuery('#contentGallery').cycle({ 
       fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc... 
      }); 
     }); 
    </script> 
</head> 

<body <?php body_class(); ?>> 
<div id="page" class="hfeed"> 
    <header id="branding" role="banner"> 
      <hgroup> 
       <h1 id="site-title"><span><a href="<?php echo esc_url(home_url('/')); ?>" title="<?php echo esc_attr(get_bloginfo('name', 'display')); ?>" rel="home"><?php bloginfo('name'); ?></a></span></h1> 
       <h2 id="site-description"><?php bloginfo('description'); ?></h2> 
      </hgroup> 

      <?php 
       // Check to see if the header image has been removed 
       $header_image = get_header_image(); 
       if (! empty($header_image)) : 
      ?> 
      <a href="<?php echo esc_url(home_url('/')); ?>"> 
       <?php 
        // The header image 
        // Check if this is a post or page, if it has a thumbnail, and if it's a big one 
        if (is_singular() && 
          has_post_thumbnail($post->ID) && 
          (/* $src, $width, $height */ $image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(HEADER_IMAGE_WIDTH, HEADER_IMAGE_WIDTH))) && 
          $image[1] >= HEADER_IMAGE_WIDTH) : 
         // Houston, we have a new header image! 
         echo get_the_post_thumbnail($post->ID, 'post-thumbnail'); 
        else : ?> 
        <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" /> 
       <?php endif; // end check for featured image or standard header ?> 
      </a> 
      <?php endif; // end check for removed header image ?> 

      <nav id="access" role="navigation"> 

<div id="nav"> 
      <ul> 
       <li class="end"><a href="#contact" id="navContact" class="goto_contact"></a></li> 
       <li><a href="#context" id="navContext" class="goto_context"></a></li> 
       <li><a href="#artScience" id="navArtScience" class="goto_artScience"></a></li> 
       <li><a href="#home" id="navHome" class="goto_home"></a></li> 
      </ul> 
      <div class="clear"> 
      </div> 
     </div> 
     <div id="navPointer"> 
      <div id="controlContainer"> 
       <div id="pointer"> 
       </div> 
      </div> 
     </div> 
    </div> 
    <div id="contentHolder"> 
     <div id="contentGallery"> 
      <img src="Images/Gallery/london.jpg" width="1200" height="550" alt="London" /> 
      <img src="Images/Gallery/singapore.jpg" style="display: none;" width="1200" height="550" 
       alt="Singapore" /> 
      <img src="Images/Gallery/geneva.jpg" style="display: none;" width="1200" height="550" 
       alt="Geneva" /> 
     </div> 
     <div id="contentShadow"> 
     </div> 
     <div id="content"> 
      <div id="contentScroller"> 
       <div id="home" class="page"> 
        <div class="homeContent"> 
         <span class="homeHeaderText">GMR</span> 
         <div class="clear"> 
         </div> 
         <div class="homePageText"> 
          <p> very long text 1 
          </p> 
         </div> 
        </div> 
       </div> 
       <div id="artScience" class="page"> 
        <div class="pageContent"> 
         <div id="artSciencePage"> 
          <span class="headerText">About Us</span> 
          <div class="pageText"> 
           <p> 
            Insert text here. 
           </p> 
          </div> 
          <table border="0" cellpadding="0" cellspacing="0" class="linkTable"> 
           <tr> 
            <td valign="middle" height="100%"> 
             <a href="#" id="theArtLnk" class="largeArrow">The Art</a> 
            </td> 
            <td valign="middle" height="100%"> 
             <a href="#" id="theScienceLnk" class="largeArrow">The Science</a> 
            </td> 
           </tr> 
          </table> 
         </div> 
         <div id="theArtPage" class="closed"> 
          <span class="headerText">The Art</span> 
          <div class="pageText"> 
           <a href="#" class="acc_trigger">Sensitivity</a> 
           <div class="acc_container"> 
            <p>very long text 2</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger">Creativity</a> 
           <div class="acc_container"> 
            <p>very long text 3</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger">Intuition</a> 
           <div class="acc_container"> 
            <p>very long text 4</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger">Judgment</a> 
           <div class="acc_container"> 
            <p>very long text 5</p> 
           </div> 
          </div> 
          <a href="#" id="artToScienceLnk" class="largeArrow">The Science</a> 
         </div> 
         <div id="theSciencePage" class="closed"> 
          <span class="headerText">The Science</span> 
          <div class="pageText"> 
           <a href="#" class="acc_trigger_2">Methodology</a> 
           <div class="acc_container_2"> 
            <p>very long text 6</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger_2">Research</a> 
           <div class="acc_container_2"> 
            <p>very long text 7</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger_2">Team Approach</a> 
           <div class="acc_container_2"> 
            <p>very long text 8</p> 
           </div> 
           <div class="seperator"> 
           </div> 
           <a href="#" class="acc_trigger_2">Sharing Information</a> 
           <div class="acc_container_2"> 
            <p>very long text 9</p> 
           </div> 
          </div> 
          <a href="#" id="scienceToArtLnk" class="largeArrow">The Art</a> 
         </div> 
        </div> 
       </div> 
       <div id="context" class="page"> 
        <div class="pageContent"> 
         <span class="headerText">Expertise</span> 
         <div class="pageText"> 
          <a class="acc_trigger_3" href="#">Expertise</a> 
          <div class="acc_container"> 
           <p>very long text 10</p> 
          </div> 
          <div class="seperator"> 
          </div> 
          <a class="acc_trigger_3" href="#">Business Context</a> 
          <div class="acc_container"> 
           <p>very long text 11</p> 
          </div> 
          <div class="seperator"> 
          </div> 
          <a class="acc_trigger_3" href="#">Cultural Context</a> 
          <div class="acc_container"> 
           <p>very long text 12</p> 
          </div> 
          <div class="seperator"> 
          </div> 
          <a class="acc_trigger_3" href="#">Candidate Context</a> 
          <div class="acc_container"> 
           <p>very long text 13</p> 
          </div> 
          <div class="seperator"> 
          </div> 
          <a class="acc_trigger_3" href="#">Financial Context</a> 
          <div class="acc_container"> 
           <p>very long text 14</p> 
          </div> 
          <div class="seperator"> 
          </div> 
          <a class="acc_trigger_3" href="#">Service Context </a> 
          <div class="acc_container"> 
           <p>very long text 15</p> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div id="contact" class="page"> 
        <div class="pageContent"> 
         <span class="headerText">Contact</span> 
         <div class="pageText"> 
          <h2> 
           Tel: +44(0)1234 567 890</h2> 
          <h3> 
           Email: <a href="mailto:[email protected]">[email protected]</a></h3> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 

       <h3 class="assistive-text"><?php _e('Main menu', 'twentyeleven'); ?></h3> 
       <?php /* Allow screen readers/text browsers to skip the navigation menu and get right to the good stuff. */ ?> 
       <div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e('Skip to primary content', 'twentyeleven'); ?>"><?php _e('Skip to primary content', 'twentyeleven'); ?></a></div> 
       <div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e('Skip to secondary content', 'twentyeleven'); ?>"><?php _e('Skip to secondary content', 'twentyeleven'); ?></a></div> 
       <?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?> 

      </nav><!-- #access --> 
    </header><!-- #branding --> 

これは私がfooter.phpで使用しているコードです:

<div id="footerNav"> 
    <ul> 
     <li class="start"><a href="#home" class="goto_home">Home</a></li> 
     <li><a href="#artScience" class="goto_artScience">About Us</a></li> 
     <li><a href="#context" class="goto_context">Approach</a></li> 
     <li><a href="#contact" class="goto_contact">Expertise</a></li> 
    </ul> 
</div> 
+0

は、私たちに生成されるマークアップではなく、PHPのソースをしてください表示します。 –

+0

あなたはjQueryをインクルードする必要があります – Joe

+4

そして、他のすべてのライブラリの前に 'jquery.js'を含めますか? –

答えて

149

jQueryのは、インポート最初スクリプトである必要があります。あなたのページの最初のスクリプト

<script type="text/javascript" src="/test/wp-content/themes/child/script/jquery.jcarousel.min.js"></script> 

はjQueryのは、まだページにロードされていないので、可能性の高いエラーを生成しているjQueryのプラグイン、ように見えます。

+2

それは便利だった!私はページ全体が読み込まれた後にそれを含めていました... – Darkeden

+5

jQueryとはページの**最初の**スクリプトですが、とにかくエラーがありますか? – Green

+0

レールでの私の問題も解決しました。私はまずjqueryの前にブートストラップを入れました。しかし、その後、Jqueryが最初に含まれていて、ブートストラップが含まれていました。 –

2

ヘッダーにはjQuery自体は含まれていませんが、プラグインだけが含まれているようです。 '<'というエラーについては、生成されたHTMLを見ずに告げるのは不可能です。あなたはwp_head(後にそれを置く必要があるのwp-adminの/管理者-header.phpの中に、このjqueryの分JS

script src="http://code.jquery.com/jquery-1.10.1.min.js" 

0

セット

+0

私は答えが合うと思います。私はaskerがwordpressを使用しているかどうか分かりません。ヘッダーにjqを追加することで問題を解決します。 –

+0

@ Bernd Ott私はワードプレスでも同じ問題が発生していますが、私はこの投稿にコメントする理由をmin js thatsを追加することでこれを解決しています。 –

10

)。 これはあなたのjQueryをロードするので、最初にjQueryをロードしてからjsをロードする必要があります

+0

これは答えとしてマークする必要があります。 jQueryが最初にロードされてから、@JorgeMadafakaのように後にすべてのjsを含めます。 – JoshYates1980

+0

非常に有用な感謝をたくさん:) –

3

私のケースでは、間違ったバージョンのjqueryを使用していたためエラーが発生しました。

<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 

私はそれを変更:

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
関連する問題