2012-01-16 19 views
81

me han puesto en práctica algo de JavaScript en mi sitio, pero me siguen dando los siguientes mensajes de error:ReferenceError no detectada: jQuery no está definido

Uncaught ReferenceError: jQuery is not defined

y

Uncaught SyntaxError: Unexpected token <

Este es el código JavaScript que estoy usando en el 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 --> 

Este es el código que estoy utilizando en el 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

Muéstranos el marcado generado, no la fuente de PHP, por favor. –

+0

Necesita incluir jQuery – Joe

+4

Y * ¿* incluye 'jquery.js', probablemente antes de todas las demás bibliotecas? –

Respuesta

149

jQuery es necesario que haya el guión primera importar. El primer script en su página

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

parece ser un plugin de jQuery , lo que probablemente está generando un error ya que jQuery no se ha cargado en la página aún.

+2

¡Eso fue muy útil! Lo incluí después de que se carga toda la página ... – Darkeden

+5

¿Qué es jQuery es el ** primer ** script en la página y hay un error de todos modos? – Green

+0

Resolvió mis problemas en los rieles también. Primero incluí bootstrap antes de jquery. Pero luego la solución fue incluir Jquery primero y luego arrancar. –

2

Para empezar, no parece incluir jQuery en el encabezado, sino solo un montón de complementos. En cuanto al error '<', es imposible saberlo sin ver el código HTML generado.

0

conjunto este min jQuery js

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

en wp-admin/admin-header.php

+0

Creo que la respuesta se ajusta. pero no estoy seguro si asker usa wordpress. pero resuelve el problema agregando jq al encabezado. –

+0

@ Bernd Ott también he tenido el mismo problema en wordpress y he resuelto esto agregando min js, por eso hago un comentario en esta publicación. –

10

que necesita para ponerlo después wp_head(); Porque eso carga su jQuery y necesita cargar jQuery primero y luego su js

+0

Esto debe marcarse como respuesta. jQuery es el primero en cargar, luego incluye todos los js después mencionados por @JorgeMadafaka – JoshYates1980

+0

Muy útil gracias mucho :) –

3

En mi caso, el error ocurrió porque estaba usando la versión incorrecta de jquery.

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

lo cambié a:

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
Cuestiones relacionadas