由 jQuery 元素组成的对象

发布于 2024-08-27 02:04:09 字数 686 浏览 6 评论 0原文

当前代码

我已经构建了函数来对 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 元素的“集合”,那么为集合中的每个元素存储一些数据的最简单方法是什么?

current code

I've built function to do something over collection of jQuery elements:

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

I add them with:

collection = collection.add(e);

and remove with:

collection = collection.not(e);

It's pretty straightforward solution, works nicely.

problem

Now, I would like to have an object consisting of various settings set to any jQuery element, i.e.:

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

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

But when I pass jQuery object/element to function (i.e. as e), calling e.data doesn't work, although it would be simplest and really nice solution.

question

If I have an "collection" of jQuery elements, what is the simplest way of storing some data for each element of set?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

汹涌人海 2024-09-03 02:04:09

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

If those "elements" are actual DOM elements (nodes), then can't you just use $(e).data(...)?

葬心 2024-09-03 02:04:09

啊,已经解决了:)

最后一个版本:

这是有点简化的代码:

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 的所有类型支持。

Ah, solved it already :)

last version:

This is somewhat simplified code:

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

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

solution

Problem was, that I wanted to keep myself option to add element via $('element'), 'element', or $(this), so I had to add typeof check before setting data - the same way jQuery works.

if I'm adding element as selector only, it's $(e), if I'm adding jQuery object, it's e:

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

So you all get upvote, and I'll pick myself as a winner in two days, so anyone who will stumble upon this question will know what to do (clearly, tested, works :]) and why :)

Edit: note: This probably isn't final version - I have read more documentation, so this setData function supports all types which jQuery.add supports.

紧拥背影 2024-09-03 02:04:09

我认为当你以这种方式处理一个集合并添加一个项目时,问题就出现了......如果它还没有被 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);
}

I think the problwm ia when youre dealing with a collection in this fashion and you add an item... if it hasnt been wrapped with jquery yet it wont be. Thus, when accessed again its simply the raw element.

If i am correct in this line of thinking an e is infact a dom element/node (or its string representation) then a simple $(e) should give you access to its data method.

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

  $(e).data('settings', o);
}
酒绊 2024-09-03 02:04:09

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

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

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

这有效,而且更简洁(至少在我看来):

    $.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

Is it because you've missed a comma between your two properties?

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

(I doubt it, but felt the need to point it out)

This works, and is somewhat neater (IMO at least):

    $.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
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文