在Ghost博客上初始化滑块时,未定义不是函数

时间:2015-01-20 16:08:47

标签: javascript jquery node.js ghost-blog

所以我现在一直在努力解决这个问题:

我试图在Ghost博客主题上初始化滑块,但我在控制台上的所有内容都是:

Uncaught TypeError: undefined is not a function

注意:错误指向.slick([...]);函数。

  • 据我所知,它可能是一个过时的jQuery,或与{{ghost_foot}}帮助器发生冲突:

    • Ghost博客使用1.10.X jQuery版本 - Slick Slider需要1.7+,但无论如何,我试图在{{ghost_foot}}帮助后添加2.1.3版本 - 遗憾的是,仍然收到同样的错误
    • 我听说没有办法禁用Ghost jquery默认inlcude,所以我试图删除{{ghost_foot}}帮助程序并包含2.1.3 jQuery版本 - 仍然收到相同的错误
    • 保留1.10.X版本,并添加jQuery Migrate插件 - 无变化
    • 粘贴原始jQuery,然后在控制台上粘贴Slick.js,然后尝试初始化滑块 - 仍然相同

现在一瞥我的gruntfile:

uglify: {
  options: {
    mangle: false
  },
  combinejs: {
    files: {
      '<%= ghost_location %>content/themes/<%= ghost_theme_name %>/assets/js/all.min.js': 
      [
      'bower_components/treasure/dist/js/treasure.js',
      'bower_components/bootstrap/dist/js/bootstrap.min.js',
      'js/parallax.min.js',
      'js/keypress.min.js',
      'bower_components/slick/dist/slick.min.js',
      'js/script.js'
      ]
    }
  }

滑块循环:

&#13;
&#13;
<div class="col-xs-12 no-padding slider">
  {{#foreach posts}}
    {{#if featured}}
      <article class="article_pombo col-xs-12 {{post_class}} no-padding featured slide" role="article" itemscope itemtype="http://schema.org/Article">
        <div class="col-xs-12 no-padding a">
          <div class="dummy"></div>
          <div class="inner-wrapper">
            <div class="img-w">
              {{#if image}}
                <img src="{{image}}" alt="{{title}}" title="{{title}}" />
              {{/if}}
            </div>
            <div class="tit-w">
              <h1 class="posttitle_pombo" itemprop="headline"><a href="{{{url}}}" rel="bookmark">{{title}}</a></h1>
              <p itemprop="articleBody">{{excerpt characters="150"}}</p>
              <div class="author_pombo" itemprop="authorName">
                {{#author}}
                  <a href="{{url}}">
                    {{#if image}}
                      <img src="{{image}}" alt="{{name}}" title="{{name}}" />
                    {{else}}
                      {{content characters="0"}}
                    {{/if}}
                  </a>
                  <span class="name">{{name}}</span>
                  <time class="date_pombo" datetime="{{date format="YYYY-MM-DD"}}" itemprop="datePublished">{{date format='dddd DD MMM YYYY'}}</time>
                {{/author}}
              </div>
              {{#if tags}}
                <div class="posttags_pombo">
                  Tags: {{tags separator=" | "}}
                </div>
              {{/if}}
            </div>
          </div> 
        </div>
      </article>
    {{/if}}
  {{/foreach}}
</div>
&#13;
&#13;
&#13;

和JS:

&#13;
&#13;
jQuery(document).ready(function($) {
  wbst.init();
});

var wbst = {
  init: function() {
    this.validate();
    this.allPage();
  },
    allPage: function() {
    tools.vendors.slick();
  }
};

var tools = {
  vendors: {
    slick: function() {
      if (jQuery('.slide').length > 1) {
        jQuery('.slider').slick();
      }
    }
  }
};

// I've stripped it down, to allow better understanding of what may be causing it...
&#13;
&#13;
&#13;

0 个答案:

没有答案