Swipe.js在Meteor中不起作用

时间:2014-01-02 19:09:15

标签: javascript meteor

我正在构建一个带有图像滑块的页面。我在之前的项目中测试了JS和HTML,而不是我只需要它在Meteor上工作。

我在mrt add jquery添加了jQuery,然后将其他javascript文件添加到我在client/lib创建的文件夹中。但是现在我收到了这个错误

ReferenceError: Swipe is not defined

console

这是我的模板

<template name="imageSlider">
  <h1>Cases</h1>
  <div class="casesContainer">

    <div class="caseTitle">
      <span class="caseNumber">Case</span>
      <div class="wrap">
        <span class="caseBack" onclick='mySwipe.prev()'>Back</span>
        <span class="caseForward" onclick='mySwipe.next()'>Forward</span>
      </div>
    </div>

    <div id='caseSlider' style='max-width:500px;margin:0 auto' class='swipe'>
      <div class='swipe-wrap'>
      <div><b>0</b></div>
      <div><b>1</b></div>
      <div><b>2</b></div>
      <div><b>3</b></div>
      <div><b>4</b></div>
      <div><b>5</b></div>
    </div>
  </div>        
</template>

这是我的swipe-init.js

var elem = document.getElementById('caseSlider');
window.caseSlider = Swipe(elem, {
  startSlide: 1,
  speed: 400,
  auto: 3000,
  continuous: true,
  disableScroll: false,
  stopPropagation: false,
  callback: function(index, elem) {},
  transitionEnd: function(index, elem) {}
});

1 个答案:

答案 0 :(得分:1)

评论中提及的emgee看起来像是一个命名空间问题。

在提取swipe.js文件并查看后,似乎就是这样。

如果你看一下这个功能:

function Swipe(container, options) {

  "use strict";

  // utilities
  var noop = function() {}; // simple no operation function
  var offloadFn = function(fn) { setTimeout(fn || noop, 0) }; // offload a functions execution

  // chec...

您将看到它不在全球范围内。在meteor中使用function关键字定义函数时,只能在该文件中访问它。要使其全局化,您应将其更改为:

Swipe = function(container, options) {

  "use strict";

  // utilities
  var noop = function() {}; // simple no operation function
  var offloadFn = function(fn) { setTimeout(fn || noop, 0) }; // offload a functions execution

  // chec...