Question

使用Javascript在选择列表中构建选项列表时，我想将Javascript对象附加到我可以在更改事件中轻松检索的选项。

所以，在写这个问题时，我想提供一些示例代码并找到一种方法来完成这项工作;所以我对这个问题略有补充。将javascript对象附加到DOM元素是不是很糟糕？回到那一天，我记得在某些情况下存在内存泄漏问题。

var objs = [
  { id: 1, value: "One", type: "number" },
  { id: 2, value: "Two", type: "number" },
  { id: 3, value: "Three", type: "number" },
  { id: "A", value: "A", type: "char" },
  { id: "B", value: "B", type: "char" },
  { id: "C", value: "C", type: "char" },
  ];

var options = $.map(objs, function(item, idx) {
  var opt = $("<option/>").val(item.id).text(item.value);
  opt[0]["obj"] = item;
  return opt;
});

$.fn.append.apply($("#select"), options)
  .change(function() {
    $("#select option:selected")
      .each(function(){
    alert(this.obj.type);
      });
  });

Answer 1

使用jQuery的.data()函数。

更新示例：http://jsbin.com/afolo3/2

Answer 2

您当然可以按照您的方式将对象附加到元素实例;事实上，这就是jQuery如何在当前版本中实现其data魔术。

那就是说，既然你已经使用了jQuery ，我可能会使用jQuery API代替它（data），以防万一它在某个阶段，浏览器出现在需要解决方法的场景中 - 您将获得jQuery维护者为您执行解决方法的好处，而不必自己完成。

Here's使用data会是什么样子。基本上是设置数据：

opt.data("obj", item);

...并检索并显示其type属性：

alert(opt.data("obj").type);

...在每种情况下，opt是所讨论的option元素的jQuery对象。

jQuery data函数的一个小问题：如果你检索一个你从未设置的数据对象，你将得到null（而不是undefined，这将是是通常的JavaScript惯例。）

有没有办法将Javascript对象附加到选择选项

2 个答案: