如何将对象添加到jQuery对象,以便我以后可以检索它?

时间:2013-04-26 16:36:41

标签: jquery

正在发生的事情的例子:

> $('#start_date').dateTime = {bacon:5, myFunc: function() { ... }}
Object {bacon: 5, myFunc: function}
> $('#start_date').dateTime
undefined

如果我使用相同的选择器,我希望能够检索我的“培根”对象。

我得到$()每次都返回一个不同的对象 - 是否有解决方法?

我知道我可以使用.data,但API不太好用。我必须$('#start_date').data('dateTime').myFunc()代替$('#start_date').dateTime.myFunc()

3 个答案:

答案 0 :(得分:2)

如果你这样做,你会感觉好一点吗?

$('#start_date').data().dateTime.myFunc()


或者,您可以扩展jQuery以使您的生活更轻松,或使jQuery以您喜欢的方式工作

在这里,我为您量身定制了一个小插件,以便您可以传入点符号字符串来检索所需的数据。在这种情况下,它返回一个函数,所以我们可以直接调用它。

DEMO http://jsfiddle.net/terryyounghk/8tWLn/

插件代码

// Small plugin
$.fn.myData = function (namespace) {
    var namespaces = namespace.split('.'),
        data = this.data();
    $.each(namespaces, function (i, that) {
        data = data[that];
    });
    return data;
}

使用示例

// set your data
$('#start_date').data('dateTime', {
    bacon:5, 
    myFunc: function() { 
        alert('mmm, bacon') 
    }
});


// call your function, note the dot notation
$('#start_date').myData('dateTime.myFunc')(); // better?

这里的哲学是,如果我们不断重复某些事情,就必须有一些愚蠢的事情发生。 有没有办法扩展jQuery让我的生活更轻松?你是法官。

就个人而言,我不喜欢这个插件。如果我正在编写单行代码,我更喜欢我的第一个建议。但谁知道呢?你可能会喜欢后者。

答案 1 :(得分:1)

您可以将属性添加到DOM元素,而不是jQuery对象:

$('#start_date')[0].dateTime = {bacon:5};
console.log($('#start_date')[0].dateTime);

或者您可以使用选择器作为键来维护某种字典。但是,调用仍然不是很时尚,并且值与DOM没有关联:

//for example save your data by id attribute
DOMData[$('someselector').attr('id')].dateTime = {bacon: 5}; 

答案 2 :(得分:1)

将数据与DOM元素相关联的jQuery方法是使用data method

$('#start_date').data('dateTime', {bacon:5, myFunc: function() { ... }});

一旦您设置了数据,就可以致电:

baconTime = $('#start_date').data('dateTime');
baconTime.myFunc();

就API而言,它与jQuery api的其余部分一致,其中访问者版本为:

$(...).method(key);

和mutator版本是:

$(...).method(key, value);