1

我基本上试图摆脱程序化 js 方法，因此尝试更多地使用对象。我已经在我的整个对象中设置了一个对象来缓存选择器并设置变量等，但我似乎遇到了问题。目前，当我运行此代码时出现 2 个错误，告诉我 .length 和 .children 都未定义。有人可以解释设置这些的正确方法，以便可以使用 jquery 方法吗？

JS

var bop = {

        els: {
           // cache selectors ...
            grid: $( '#grid' ),
            box: this.grid.children(),
            box_l: this.box.length,
            start_btn: $( '#start' ),
            counter: $( '#counter' ),
            sequence: 5            
        }
}
4

3 回答 3

5

如果您希望这this将引用您正在使用对象文字构建的正在构建的对象，那么这就是您的问题。JavaScript 不能那样工作。

你可以这样做：

var bop = {
 els: {
   grid: $('#grid'),
   // ...
 }
};

bop.els.box = box.els.grid.children();
// etc

该this参考资料完全是关于函数调用的，实际上与对象无关，或者如果您来自 C++/C#/Java 背景，您可能会认为它没有那么重要。

于 2012-06-11T13:00:08.853 回答
2

在文字对象内部使用时this，它不引用正在创建的对象，它仍然与文字对象外部的代码相同。

于 2012-06-11T13:01:34.363 回答
1

如果您非常想使用this，请将您的缓存对象更改为

els: {
           // cache selectors ...
            grid: $( '#grid' ),
            box: function(){
                   return this.grid.children()
            },
            box_l: function(){
                  return this.box().length
            },
            start_btn: $( '#start' ),
            counter: $( '#counter' ),
            sequence: 5            
        }

否则，请确保$( '#grid' )在使用boxandbox_1属性时参考。

在旁注中，这个小提琴将帮助你理解为什么你的this工作方式不像你认为的那样工作。干杯。

于 2012-06-11T13:03:43.673 回答