jquery - 从 Select2 4.0 读取 HTML5 数据-属性

Question

我有一个这样定义的选择:

<select class="myselect">
  <option value="AL" data-foo="bar">Alabama</option>
    ...
  <option value="WY"  data-foo="biz">Wyoming</option>
</select>

在 Select2 的早期版本中，我可以轻松检索数据值，如下所示:

alert($("#" + controlid).select2().find(":selected").data('foo'));

但是，这在 Select 2 4.0 中不起作用

有什么想法或建议吗？

Answer 1

Select2 4.0.0 的工作方式就像标准的 <select> ，所以这里的问题是:How do I read data-* attributes on an <option> ? 。

现在，如果您只是想从已经可以检索的选项中获取数据属性，那么该问题的答案应该按原样工作。需要注意的是，Select2 并不直接设置 selected 属性，而是设置 selected 属性，因此如果您想获取所选选项，则必须使用 :selected 选择器而不是 [selected]。

您的问题有点宽泛，因此您可能正在寻找如何使用模板函数访问这些属性。所以你的问题是: How do I read the attributes of an <option> in the templating functions? ，它有一个 Select2 3.5.x 的答案，它在 4.0.0 中仍然有效。

模板函数的第一个参数应该是数据对象。假设您没有使用 AJAX(因为 <option> 不存在)，数据对象有一个属性 element，它是数据对象表示的 DOM 元素。您可以通过执行 $(data.element).data("myAttribute") 来获取这些数据属性，就像处理任何其他元素一样。