变量作用域：this.remove不是函数

Question

this.remove（）不是函数。怎么来的？

var vehicle = function() { 
    return { 
     init: function() { 
      jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
       e.preventDefault(); 
       this.remove(); 
      }); 
     }, 
     remove: function() { 
      alert('test'); 
     } 
    } 
}(); 

jQuery().ready(vehicle.init); 

对不起，我感到困惑。我试图调用我自己的“删除”功能。这只是一个管理我的页面上的车辆的课程。这是它的开始，它将比只是init/remove有更多的功能。

Answer 1

既然你说你想打电话给你自己remove功能，这里是如何做到这一点：

var vehicle = (function() { 
    return { 
     init: function() { 
      var that = this; // step one 
      jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
       e.preventDefault(); 
       that.remove(); 
      }); 
     }, 
     remove: function() { 
      alert('test'); 
     } 
    } 
}()); // step zero - wrap the immediate invocation in parens 

jQuery(function() { 
    vehicle.init(); // step two 
); 

Answer 2

this是一个DOM元素。要使用jQuery的.remove()方法，您需要将它包装在一个jQuery对象中。

$(this).remove(); 

编辑：如果你希望来调用vehicle对象remove()函数，然后调用：

vehicle.remove(); 

---

另外，如果你希望缩短.ready()电话，你可以这样做：

jQuery(vehicle.init); 

从jQuery 1.4 release notes：

的jQuery().ready()技术仍然工作在1.4，但它已被弃用。请使用jQuery(document).ready()或jQuery(function(){})。

Answer 3

var vehicle = function() { 
    return { 
     init: function() { 
      var self = this; 
      jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
       e.preventDefault(); 
       self.remove(); 
      }); 
     }, 
     remove: function() { 
      alert('test'); 
     } 
    } 
}(); 

jQuery().ready(function() { 
    vehicle.init(); 
}); 

Answer 4

注意 - 我们都有点困惑，因为目前还不清楚其中“删除”你要调用函数。

问题是你传入了对“init”函数的引用，但是当它被称为“this”变量时，将引用窗口对象，而不是“vehicle”的值。为什么？因为在Javascript中，“this”值仅取决于函数的调用方式。两个函数被定义在同一个对象中的事实与它完全无关。

尽量不要做这样的：

jQuery(function() { 
    vehicle.init(); 
}); 

当你调用“初始化”功能，通过明确地引用它作为“车辆”的属性的方式—对象—然后用JavaScript绑定“本”的“车辆”的价值。

编辑哦，等等我只注意到你也将不得不修改你的“初始化”功能，因为这里面的代码“点击”处理器将是jQuery的通过以这样的方式被称为把这个“这个”绑定到受影响的元素。因此，如果你想保持“车辆”的参考，你应该这样做：

init: function() { 
     var originalThis = this; 
     jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
      e.preventDefault(); 
      originalThis.remove(); 
     }); 
    }, 

Answer 5

也许你正在寻找类似的东西？

var vehicle = new function() { 

    var self = this; 

    this.init = function() { 
    jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
     e.preventDefault(); 
     self.remove(); 
    }); 
    }; 

    this.remove = function() { 
    alert('test'); 
    }; 

}; 

...或者像这样或许？很难说出你要做什么...

var vehicle = new function() { 

    function remove() { 
    alert('test'); 
    } 

    this.init = function() { 
    jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
     e.preventDefault(); 
     remove.call(this); 
    }); 
    }; 

}; 

Answer 6

当调用一个函数的方法“这个”指的是物体调用它。在jQuery中，传递的函数作为html元素的一个方法被调用，所以“this”成为元素。

为了确保您引用了正确的对象，您需要创建对原始对象的引用。

var vehicle = function() { 
     var that = { 
     init: function() { 
      jQuery('.vehicle-year-profile .options .delete').bind('click', function (e) { 
       e.preventDefault(); 
       that.remove(); 
      }); 
     }, 
     remove: function() { 
      alert('test'); 
     } 
    } 
    return that; 
    }(); 

jQuery().ready(vehicle.init);