Javascript/Jquery对象文字版本，根据变量请求执行函数

我有以下代码：

var ST = {
         city: 'a#cityId:eq(2)',
         state: 'div.location:eq(1)',
         zip: 'p#zipcodes:eq(3)',
         people: 'div.population :input',
         autoload: function(selector) {
                 var elem = $(selector).get(0);
                 if (!elem || elem == 'undefined' || elem.length == '0') {
                         return false;
                 }
                 return elem;
         },
};

例如，我可以请求可变城市，并通过自动加载功能自动执行它吗

这就是我想要实现的目标：

ST.city ? ST.city.click() : '';

---

如果您只想执行

ST.city.click（）

，而不必担心是否有任何内容与选择器匹配，请坚持使用jQuery集，而不是直接尝试使用DOM元素

如果您可以依靠拥有

Object.defineProperty

（目前支持是合理的，但IE8中没有对普通对象的支持），您可以这样做：

var ST = {};
Object.defineProperties(ST, {
    "city": {
        get: function() {
            return $('a#cityId:eq(2)'); // (But see Mottie's note about this selector)
        }
    },
    "state": {
        get: function() {
            return $('div.location:eq(1)');
        }
    },
    // ...and so on
});

由于属性的getter返回jQuery集，因此您可以愉快地调用

并单击它们，即使它们是空的：

ST.city.click();

以上内容可以更简短，为了清晰起见，我把它留了下来。以下是简短的版本：

var ST = {
    city: 'a#cityId:eq(2)',
    state: 'div.location:eq(1)',
    zip: 'p#zipcodes:eq(3)',
    people: 'div.population :input'
};
$.each(ST, function(key, value) {
    Object.defineProperty(ST, key, {
        get: function() {
            return $(value);
        }
    });
});

但如果您需要支持较旧的浏览器，则需要一个函数调用。您可以使
ST
本身成为函数：

var ST = function(selector) {
    return $(ST.selectors[selector]);
};
ST.selectors = {
    city: 'a#cityId:eq(2)',
    state: 'div.location:eq(1)',
    zip: 'p#zipcodes:eq(3)',
    people: 'div.population :input'
};

var ST = {
    city: 'a#cityId:eq(2)',
    state: 'div.location:eq(1)',
    zip: 'p#zipcodes:eq(3)',
    people: 'div.population :input',
    autoload: function(selector) {
        return $(this[selector]);
    }
};

用法：

ST('city').click();

ST.autoload('city').click();

或者在
ST
函数上创建属性：

var ST = function(selector) {
    return $(ST.selectors[selector]);
};
ST.selectors = {
    city: 'a#cityId:eq(2)',
    state: 'div.location:eq(1)',
    zip: 'p#zipcodes:eq(3)',
    people: 'div.population :input'
};

var ST = {
    city: 'a#cityId:eq(2)',
    state: 'div.location:eq(1)',
    zip: 'p#zipcodes:eq(3)',
    people: 'div.population :input',
    autoload: function(selector) {
        return $(this[selector]);
    }
};

用法：

ST('city').click();

ST.autoload('city').click();

使用的选择器将只产生一个元素（
a#cityId
），因此在末尾包含
：eq（2）
将不会返回结果。确定，但即使
a#cityId
也只会返回一个result@undefined：
a#cityId
只返回0或1个结果，因此
：等式（2）
总是不满意，因此
a#cityId:eq(2)
是一个无意义的选择器，它永远不会匹配有效文档中的任何内容。在多个元素上使用相同的
id
会导致无效文档。无效文档上选择器引擎的行为未定义。它可能会引发错误，可能只返回第一个，也可能只返回最后一个，或者可能返回al我是他们中的一员，这是没有定义的。（没有双关语！）@未定义：我的观点是，你不能指望它返回什么。行为是未定义的。你描述的是它对Chrome的选择器引擎的作用，但你不知道在Chrome的下一个dot版本中，还是在Firefox中，或者…@undefined:Sizzle将遵从浏览器的选择器引擎（如果可以的话）。特定的sel您是对的，ector将使用Sizzle的代码，因为它使用jQuery（Sizzle的）
：eq
，但即便如此，对Sizzle的下一次更新可能会改变它。一般情况下，比如说
a#cityId.foo
，将卸载到浏览器的选择器引擎。我想我可以在一个对象中定义所有选择器，并使用object.defineProperty迭代。分配自动加载函数，我会尝试一下。但我需要一个错误的answer如果元素不存在。@Ionut:但是您不能调用
单击
上的
单击
“false”
。您说过要执行
圣城。单击（）
，那里没有检查，这就是我使用jQuery对象的原因，因此您可以不进行检查就执行该操作。我在单击之前进行验证：圣城？圣城。单击（）：“”；@Ionut:Huh，我本来可以发誓这只是圣城。当我最初阅读这个问题时，点击（）
。我想问你的问题是：为什么？为什么要做额外的工作？我的意思是，你可以，我可以更新答案来说明如何做，但是……这只是额外的工作。@Ionut:极好，我很高兴这很有帮助！