【问题标题】:object consisting of jQuery element由 jQuery 元素组成的对象
【发布时间】:2010-03-31 12:30:45
【问题描述】:

当前代码

我已经构建了函数来处理 jQuery 元素的集合:

var collection = $([]); //empty collection

我添加它们:

collection = collection.add(e);

并删除:

collection = collection.not(e);

这是非常简单的解决方案,效果很好。

问题

现在,我想要一个由各种设置组成的对象,设置为任何 jQuery 元素,即:

function addObject(e){
  var o = {
    alpha: .6 //float
    base: {r: 255, g: 255, b: 255} //color object
  }

  e.data('settings', o);
}

但是当我将 jQuery 对象/元素传递给函数时(即作为e),调用e.data 不起作用,尽管这将是最简单且非常好的解决方案。

问题

如果我有一个 jQuery 元素的“集合”,为集合的每个元素存储一些数据的最简单方法是什么?

【问题讨论】:

  • 我不知道您可以创建和使用您所说的集合。就是这样一块金子。谢谢!
  • @prodigitalson:我可能不得不写博客,虽然我不认为这是一个独特的想法......是吗? :]
  • 嗯,也许只是“没有创意”,但我从来没有想过将空数组/对象传递给 jQ 以获得由它支持的裸集合。我总是使用一个数组/对象,然后在它上面使用$.each,这当然意味着实现中的许多其他事情:-)
  • 我仍然通过$.each 浏览这个collection,但是,控制该集合中的内容非常简单。
  • @prodigitalson,@justkt:我听到了。 adam.kissyour.net/11-using-empty-set-with-jquery-part-1 @prodigitalson:阅读那篇博文,你就会明白我为什么使用这种结构。或者更好,也许你会告诉我更好的方法:]

标签: jquery object storing-data


【解决方案1】:

如果这些“元素”是实际的 DOM 元素(节点),那么您不能只使用$(e).data(...)吗?

【讨论】:

  • Pointy:这是我的问题之一 - add 支持三四种方式来描述你想要添加的内容,所以你必须检查你实际添加的类型
【解决方案2】:

啊,已经解决了:)

最新版本:

这是一些简化的代码:

function setData(e,key,data){
  if(typeof(e)==string){ e = $(e); }

   $(e).data(key,data);
}

解决方案

问题是,我想保留通过$('element')'element'$(this) 添加元素的选项,所以我必须在设置数据之前添加typeof 检查 - 与 jQuery 的工作方式相同。

如果我将元素添加为仅选择器,则为$(e),如果我添加jQuery 对象,则为e

function setData(e,key,data){
  if(typeof(e)==string){
    $(e).data(key,data);
  }else{
    e.data(key,data);
  }
}

所以你们都获得了投票,我会在两天内将自己选为获胜者,所以任何偶然发现这个问题的人都会知道该怎么做(显然,经过测试,有效:])以及为什么:)

编辑:注意:这可能不是最终版本 - 我已经阅读了更多文档,所以这个 setData 函数支持 jQuery.add 支持的所有类型。

【讨论】:

  • 那么添加到集合中的节点实际上是用 jQuery 包装的?
  • 有些是 - 已经,有些不是。这就是typeof 检查的重点——决定哪些已经包装,哪些没有:]
【解决方案3】:

我认为问题在于,当您以这种方式处理一个集合并添加一个项目时......如果它没有被 jquery 包装,但它不会被包装。因此,当再次访问它时,它只是原始元素。

如果我的这种想法是正确的,e 实际上是一个 dom 元素/节点(或其字符串表示形式),那么一个简单的 $(e) 应该可以让您访问它的 data 方法。

function addObject(e){
  var o = {
    alpha: .6 //float
    base: {r: 255, g: 255, b: 255} //color object
  }

  $(e).data('settings', o);
}

【讨论】:

  • 这样,如果我addObject ($(this)),它会失败......所以我必须检查检查检查:]
【解决方案4】:

是因为您在两个属性之间漏掉了一个逗号吗?

  var o = {
    alpha: .6 <-- here 
    base: {r: 255, g: 255, b: 255} 
  }

(我对此表示怀疑,但觉得有必要指出)

这行得通,而且更整洁(至少在 IMO):

    $.fn.addObject = function(){
        var o = {
            alpha: .6, //float
            base: {r: 255, g: 255, b: 255} //color object
        }
         $(this).data('settings', o);
    };

    // simple test
    $("div").addObject();
    alert($("div").data("settings").alpha); // alerts 0.6

【讨论】:

  • karim79:好主意,不幸的是,添加该对象只是更大“插件”的一部分,所以这对我来说太“脏”了:]谢谢你的尝试,但是:]跨度>
猜你喜欢
  • 2019-01-23
  • 2021-04-20
  • 2021-07-21
  • 1970-01-01
  • 2012-06-20
  • 2016-02-01
  • 2019-11-02
  • 2015-12-23
  • 1970-01-01
相关资源
最近更新 更多