javascript - 访问对象中的元素

我在访问对象中的某些元素时遇到麻烦。
在我的 View 文件(又称HTML页面)中，我正在初始化c App。

  //Yh script tags are wrapped around this
  $(function() {
      App.initialize();
  });

然后在我的JS文件中(这是我实际工作的一种简单形式):

window.App = {
    el: {
        slider: $("#form-slider"),
        allSlides: $(".slide")

    },
    initialize: function() {
        this.ProductNewEvents();
            //bla bla
            // and so on
    },
    slideTiming: 800,
    slideWidth: 790,
    delegat etc
    ProductNewEvents: function() {
      //A whole bunch of events
       this.el.slider.click(function() {
           alert("Why you no work");
       });
       $("#form-slider").click(function() {
           alert("Why you work");
       });

    },
    some other objs
};

我的问题是我无法调用this.el.allSlides.some jQuery事件或this.el.slider。让我们在任何对象中说animate或click。我必须从DOM中获取它以将任何事件绑定(bind)到元素，例如$(".slide").animate。

最佳答案

这取决于您在做什么，因为我看不到您的所有代码。当您访问App.el.slider属性时，它会在创建时保存对$('#slider')的引用。为了克服这个问题，您的代码可能必须看起来像:

window.App = {
  el: {
    slider: function(){
      $("#form-slider");
    },
    allSlides: function(){
      $(".slide");
    }
  },
  initialize: function() {
    this.ProductNewEvents();
    //bla bla
    // and so on
  },
  slideTiming: 800,
  slideWidth: 790,
  //delegat etc
  ProductNewEvents: function() {
    //A whole bunch of events

  },
  //some other objs
}
App.el.slider();