JavaScript代码不工作-$不是函数错误

时间:2016-02-02 作者:Peter_mjt

在重新设计网站时,我们想在主页上添加光滑的js旋转木马功能。遵循slick javasriprt网站的说明http://kenwheeler.github.io/slick/ 但它没有门激活,在firefox调试控制台上,它说“$不是一个函数”。

一个页面上的其他Javascript正在正确运行,所以我做错了什么,但我找不到什么

标题代码如下:

 <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head>

<meta http-equiv="Content-Type" content="<?php bloginfo(\'html_type\'); ?>; charset=<?php bloginfo(\'charset\'); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title><?php ui::title(); ?></title>

<link rel="stylesheet" type="text/css" href="<?php bloginfo(\'stylesheet_url\'); ?>" media="screen" />

<!--[if IE 7]><link rel="stylesheet" type="text/css" href="<?php bloginfo(\'template_directory\'); ?>/ie7.css" /><![endif]-->
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="<?php bloginfo(\'template_directory\'); ?>/ie6.css" /><![endif]-->
<!-- <?php if (is_home() ) {?><style type="text/css">#sidebar { margin-top: -310px; } #middle  /style> <?php } ?> -->
<?php if (option::get(\'sidebar_pos\') == \'Left\') { ?><style type="text/css">#sidebar { float:left; } #middle { float:right;} </style> <?php } ?>

<link rel="pingback" href="<?php bloginfo(\'pingback_url\'); ?>" />

<link href=\'http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,greek\' rel=\'stylesheet\' type=\'text/css\'>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.css"/>

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&appId=640072772742184&version=v2.0";
 fjs.parentNode.insertBefore(js, fjs);
 }(document, \'script\', \'facebook-jssdk\'));</script>

<?php wp_head(); ?>

    <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.5.9/slick.min.js"></script>
    <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script type="text/javascript" src="/wp-content/themes/zenko/functions/user/stepcarousel.js"></script>
     </head>
       <div id="header">
           <div id="logo">
               <?php if (!option::get(\'misc_logo_path\')) { echo "<h1>"; } ?>

               <a href="<?php echo home_url(); ?>" title="<?php bloginfo(\'description\'); ?>">
            <?php if (!option::get(\'misc_logo_path\')) { bloginfo(\'name\'); } else { ?>
                <img src="<?php echo ui::logo(); ?>" alt="<?php bloginfo(\'name\'); ?>" />
            <?php } ?>
        </a>

          <?php if (!option::get(\'misc_logo_path\')) { echo \'</h1><p id="tagline">\' . get_bloginfo(\'description\') . \'</p>\'; } ?>
    </div>

    <?php if (option::get(\'ad_head_select\') == \'on\') { ?>
        <div id="ad468">

            <?php if ( option::get(\'ad_head_code\') <> "") { 
                echo stripslashes(option::get(\'ad_head_code\'));             
            } else { ?>
                <a href="<?php echo option::get(\'banner_top_url\'); ?>"><img src="<?php echo option::get(\'banner_top\'); ?>" alt="<?php echo option::get(\'banner_top_alt\'); ?>" /></a>
            <?php } ?>          

        </div><!-- /.adv -->
    <?php } ?>

    <div class="clear"></div>

</div>

<div id="menu">
    <div id="menu-wrap">
        <?php if (has_nav_menu( \'primary\' )) { 
            wp_nav_menu(array(
            \'container\' => \'menu\',
            \'container_class\' => \'\',
            \'menu_class\' => \'dropdown\',
            \'menu_id\' => \'mainmenu\',
            \'sort_column\' => \'menu_order\',
            \'theme_location\' => \'primary\'
            ));
        }                   
        else
            {
                echo \'<p>Please set your Top navigation menu on the <strong><a href="\'.get_admin_url().\'nav-menus.php">Appearance > Menus</a></strong> page.</p>
             \';
            }
        ?>

        <?php if (option::get(\'rss_icon\') == \'on\') { ?>
            <div id="rss_icon">
                 <a href="<?php ui::rss(); ?>"><?php echo option::get(\'rss_label\'); ?></a> 
            </div>
        <?php } ?>




    </div> <!-- /#menu-wrap -->

</div> <!-- /#menu -->

  <div>







    <div id="content-wrap">

        <div id="content">

<table id="t02" style="border:#CCCCCC;">
   <tr>
 <td id="d03" ></td>
    <td id="d03" style="width:900px;padding: 0px 0px 4px 1px;">
 <script>
   (function() {
         var cx = \'012395885834974803252:tjozqtaiwbi\';
           var gcse = document.createElement(\'script\');
        gcse.type = \'text/javascript\';
        gcse.async = true;
       gcse.src = (document.location.protocol == \'https:\' ? \'https:\' : \'http:\') +
         \'//cse.google.com/cse.js?cx=\' + cx;
     var s = document.getElementsByTagName(\'script\')[0];
s.parentNode.insertBefore(gcse, s);   })();
   </script>
    <gcse:search></gcse:search>
    </td>
         <td id="d03" ></td>
     </tr>
    </table>
      <script type="text/javascript">
    //<![CDATA[
       var $j = jQuery.noConflict();
        $j(window).load(function(){
        // use $j for jquery functions
      });
      //]]> 
</script>
主要代码如下:

    <?php get_header(); ?>
<?php $paged = (get_query_var(\'paged\')) ? get_query_var(\'paged\') : 1; // gets current page number ?>

<?php if (is_home() && $paged < 2 && option::get(\'featured_enable\') == \'on\' ) { get_template_part(\'wpzoom-slider\'); } // Featured Slideshow ?>


<?php
// php code quering the posts and echoing them
?>

<table id="t01" >
    <tr>
        <td id="d01" style="width:888px;padding: 0px 0px 4px 1px; background:#DAADAE0;"><?php jnewsticker_display( 0 ) ?> </td>
        <td id="d02" style="padding-top: 0px; padding-left: 0px;"><a href="http://news.creativeopinions.org" onclick="window.open(this.href,\'targetWindow\',\'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=900\');return false;"  ><img src="http://creativeopinions.org/wp-content/uploads/2015/11/Macro-Flash-news-icon1.jpg" ></a></td>
    </tr>
</table>

<script type="text/javascript">

stepcarousel.setup({
    galleryid: \'mygallery_a\', //id of carousel DIV
    beltclass: \'belt\', //class of inner "belt" DIV containing all the panel DIVs
    panelclass: \'panel\', //class of panel DIVs each holding content
    autostep: {enable:false, moveby:2, pause:7000},
    panelbehavior: {speed:600, wraparound:true, wrapbehavior:\'slide\', persist:false},
    defaultbuttons: {enable: true, moveby: 1, leftnav: [\'http://creativeopinions.org/wp-content/uploads/2015/05/arrowl.gif\', -20, 150], rightnav: [\'http://creativeopinions.org/wp-content/uploads/2015/05/arrowr.gif\', 0, 150]},
    statusvars: [\'statusA\', \'statusB\', \'statusC\'], //register 3 variables that contain current panel (start), current panel (last), and total panels
    contenttype: [\'inline\'] //content setting [\'inline\'] or [\'ajax\', \'path_to_external_file\']
})

</script>

<div id="mygallery_a" class="stepcarousel">
    <div class="belt">
<?php
// php code to query the posts for the step carousel 
?>

</div>
</div>
<div style="clear:both"></div>

<style type="text/css">
.tg  {border-collapse:collapse;border-spacing:0;margin:0px auto;}
.tg td{font-family:Arial, sans-serif;font-size:14px;border-style:none;border-width:0px;overflow:hidden;word-break:normal;}
.tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;border-style:none;border-width:0px;overflow:hidden;word-break:normal;background: none repeat scroll 0% 0%;}
</style>
<table class="tg">
<tr>
    <th class="tg-031e" style="width: 360px; ">
    1/3 third collum
    </th>
    <th class="tg-031e" style="width: 300px; ">
    2/3 Third Column
    <h3 style="background: transparent url(&quot;http://creativeopinions.org/wp-content/themes/zenko/images/black.png&quot;) no-repeat scroll left top; color: white;" class="title">ΟΙ ΕΙΔΗΣΕΙΣ ΜΟΥ</h3>
    <style> .feed-item {padding: 5px 0px 0px 5px;background: transparent url("http://www.analyst.gr/wp-content/uploads/2015/11/bullet.gif") no-repeat scroll 0px 12px; border-bottom: 1px solid #CCC;} #ajax_text-2 { background: #F0F0F0 none repeat scroll 0% 0%;}
    .wprss-feed-meta > span:not(:last-child):after {content: \' | \';}  li.feed-item { margin-bottom: 10px;} .wprss-feed-meta > span {font-size: 90%;clear: both;}</style>
<div style="overflow:auto;height:300px;">
<?php
$args = array(
    \'before_widget\' => \'\', 
    \'after_widget\' => \'\',
    \'before_title\' => \'\',
    \'after_title\' => \'\'
    );
$instance = array(
    \'title\' => \'\',
    \'text\' => \'[wp-rss-aggregator]\'
    );
the_widget( \'AJAX_Text_Widget\', $instance, $args );
?>  
</div>
<br>
</th>
    <th class="tg-031e" style="width: 300px; ">
    3/3 Third Column
        <h3 style="background: transparent url(&quot;http://creativeopinions.org/wp-content/themes/zenko/images/black.png&quot;) no-repeat scroll left top; color: white;" class="title">ΑΓΟΡΕΣ</h3>
    </th>
</tr>
</table>

<style type="text/css">
.stepcarouselb{position: relative; /*leave this value alone*/margin-left:auto;margin-right:auto;border: 1px solid #0c98d3;overflow: scroll; /*leave this value alone*/width: 890px; /*Width of Carousel Viewer itself*/height: 90px; /*Height should enough to fit largest content\'s height*/-webkit-box-sizing: border-box; /* set box model so container width and height value includes any padding/border defined */-moz-box-sizing: border-box;box-sizing: border-box;}

.stepcarouselb .belt{position: absolute; /*leave this value alone*/left: 0;top: 0;}

.stepcarouselb .panelb{float: left; /*leave this value alone*/overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/margin: 15px; /*margin around each panel*/width: 130px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */}

span.paginatecircle{ /* CSS for paginate circle spans. Required */background: white;border: 2px solid black;border-radius: 10px;width: 6px;height: 6px;cursor: pointer;display: inline-block;margin-right: 4px;}

span.paginatecircle:hover{background: gray;}

span.paginatecircle.selected{background: black;}

</style>

<script type="text/javascript">

stepcarousel.setup({
    galleryid: \'mygalleryb\', //id of carousel DIV
    beltclass: \'belt\', //class of inner "belt" DIV containing all the panel DIVs
    panelclass: \'panelb\', //class of panel DIVs each holding content
    autostep: {enable:true, moveby:1, pause:3000},
    panelbehavior: {speed:1500, wraparound:false, wrapbehavior:\'slide\', persist:false},
    defaultbuttons: {enable: false, moveby: 1, leftnav: [\'http://marketnews.gr/images/arrowl.gif\', -20, 100], rightnav: [\'http://marketnews.gr/images/arrowr.gif\', 0, 100]},
    statusvars: [\'statusA\', \'statusB\', \'statusC\'], //register 3 variables that contain current panel (start), current panel (last), and total panels
    contenttype: [\'inline\'] //content setting [\'inline\'] or [\'ajax\', \'path_to_external_file\']
})

</script>


<div id="mygalleryb" class="stepcarouselb">
    <div class="belt">
<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-anagnostou-03/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/ANAGNOSTOU-logo-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-drinks-athenian-brewery/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/AZ_LOGO_gr_gb_3BRANDS-08-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-cavino-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/CAVINO-Logo2-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-gerovassiliou-05/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/GEROVASSILIOU-Logo-GR-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-kirgianni-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/KYRGIANNI-LogoFeb13-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-lafazani-05/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/LAFAZANIS-Logo-GR.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-papagiannakou-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/PAPAGIANNAKOS-Logo-GR3-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-semeli-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/SEMELI-Logo-cropped-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-skouras-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/SKOURAS-logo-570x321.png" /></a></div>

<div class="panelb"><a href="http://expohellas.analyst.gr/hall/b-wines-tsantali-02/" target="_blank"><img src="http://www.analyst.gr/wp-content/uploads/2015/11/TSANTALI-logo1-570x321.png" /></a></div>

</div>
</div>


<div id="middle">
    <?php if(is_home() && $paged < 2) { ?>
        <?php if (function_exists(\'dynamic_sidebar\')) { dynamic_sidebar(\'Homepage\'); } ?>
        <div class="clear"></div>
    <?php } ?>

</div><!-- /#middle -->
<?php get_sidebar(); ?>

<?php get_footer(); ?>
最后是页脚

<?php } ?>
</div> <!-- /#content-wrap -->

<div id="footer">

<div class="footer-wrap">

    <div id="fside">

    </div>

</div> <!-- /#footer-wrap-->

<div class="clear"></div>      

<div id="copyright">

    <div class="footer-wrap">

    </div> <!-- /#footer-wrap-->

</div>

</div> <!-- /#footer -->

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

<?php wp_footer(); ?> 

<?php if (option::get(\'featured_enable\') == \'on\' && $paged < 2 && is_home() ) { ui::js("jtools");  ?>

<script type="text/javascript">
var jq = jQuery.noConflict(true);
(function($) {
jq(".pagination").tabs(".slides li", {
    event: \'mouseover\', 
    effect: \'fade\',
    rotate: true
        }).slideshow({
            clickable: false,
            autoplay:  <?php if (option::get(\'featured_rotate\') == \'on\') { echo "true"; } else { echo "false"; } ?>, 
            interval: <?php echo option::get(\'featured_interval\'); ?> 
        });

    jq("#slider iframe").each(function(){
    var ifr_source = jq(this).attr(\'src\');
    var wmode = "?wmode=transparent";
    jq(this).attr(\'src\',ifr_source+wmode);
});

});
})(jQuery);
</script>
<?php } ?>

<!--Start Cookie Script--> <script type="text/javascript" charset="UTF-8" src="http://chs03.cookie-script.com/s/00d482fb3a2cee25653ca3afd78479be.js"></script> <!--End Cookie Script-->

<script type="text/javascript">
$(document).ready(function(){
    $(\'.best\').slick({
        slidesToShow: 3,
        slidesToScroll: 3,
        autoplay: true
    });
        });
</script>

</body>
</html>
你能帮我找出代码中的错误吗

1 个回复
SO网友:Jerry.S

其实我只是想发表评论,但是。。(声誉太低)这样做吧

如果出于某种原因jQuery 已加载(不推荐),正在调用$.noConflict( true ) 从第二个版本返回全局范围的jQuery 变量转换为第一个版本的变量。

因此,要解决您的“问题”(如果我是正确的话),解决方案可以是jQuery 进入noConflict 模式

单击链接并阅读,查看我的答案是否正确,是否能解决您的问题(通过为您提供“如何做/使用”的正确方法)。jQuery, write less, do more.