现有功能未定义

Question

我正在使用 hammer.js 库：http://hammerjs.github.io/ 并使用它的 jQuery 插件。很少有像 'panright panleft press' 这样的事件发生时您可以调用函数。我正在尝试调用 cardSwipe(..) 函数，但是收到一个控制台错误，指出 cardSwipe 未定义。我不知道是什么原因造成的。

/* Initiate HammerJS on elements */
        initHammer : function()
        {   
            /* Create Hammer object for swipable game cards */
            Game.$gameCard = $('.game-card-mobile');
            Game.$gameCardTouch = Game.$gameCard.hammer();

            Game.$gameCardTouch.on("panleft panright press", cardSwipe(ev, $(this), data));     
        },

        cardSwipe : function(ev, element, data) {
            console.log(ev.type);
            console.log(element);
            console.log(data);
        }

编辑：添加 Game.cardSwipe 解决了这个问题，但现在我得到一个错误：ev 未定义，其中 ev 是一个 hammer.js 事件并且应该被识别（如果我交换我的函数函数(ev) {..} )

Answer 1

那是因为 cardSwipe 在该上下文中确实是未定义的，它是父对象的一部分并且可以通过 this.cardSwipe

访问

initHammer : function() {   
    Game.$gameCard = $('.game-card-mobile');
    Game.$gameCardTouch = Game.$gameCard.hammer();

    Game.$gameCardTouch.on("panleft panright press", this.cardSwipe(ev, $(this), data));     
},
cardSwipe : function(ev, element, data) {
    console.log(ev.type);
    console.log(element);
    console.log(data);
}

看起来你是马上调用它，而不是引用它，一般你会把它转换成这样

Game.$gameCardTouch.on("events", this.cardSwipe);

或者如果您需要参数，请使用匿名函数

initHammer : function() {   

    var self = this;

    Game.$gameCardTouch.on("panleft panright press", function() {
        self.cardSwipe(ev, $(self), data);
    });
},
cardSwipe : function(ev, element, data) {

}

但我不知道 cardSwipe 到底是什么 returns，以及它应该如何工作？

Answer 2

在您的代码中，cardSwipe 函数是某个对象的属性。您将必须使用该对象引用，如：

obj.cardSwipe(...)

为了调用它 - 其中 obj 是包含属性的对象。

我不知道您代码的整个上下文，但似乎合适的参考可能是：

this.cardSwipe(...);

因为您是从同一对象的方法调用它的。

与其他一些语言不同，当前对象上的方法不会自动在范围内。您必须使用 this 来引用当前对象才能访问属性或调用当前对象的方法。

此外，您似乎正在尝试设置事件处理程序。在这种情况下，您可能不想立即调用 cardSwipe()，而是传递一个函数引用，您需要将 this 的值保存到本地，以便您可以在回调中引用它：

initHammer : function() {   
    var self = this;
    Game.$gameCard = $('.game-card-mobile');
    Game.$gameCardTouch = Game.$gameCard.hammer();

    Game.$gameCardTouch.on("panleft panright press", function() {
        self.cardSwipe(ev, $(self), data));
    });
},

现有功能未定义

existing function is undefined

javascript

jquery

hammer.js