Question

正在发生的事情的例子：

> $('#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()。

Answer 1

如果你这样做，你会感觉好一点吗？

$('#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让我的生活更轻松？你是法官。

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

Answer 2

您可以将属性添加到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};

Answer 3

将数据与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);

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

3 个答案: