Question

晚上好人。
好的，所以我有<li>个data-attribute s，比如

<li class="mix evento" data-mes="jan">

我需要从此页面上的所有li中获取所有data-mes，并将'em'添加到select＆gt;选项，但不重复它们（data-mes基本上是data-month，并且每个li代表一个带有某个日期的事件。

这将用于按月使用beautifull MixitUp Plugin来过滤Li（data-mes）

嗯，我知道，要获得1个数据属性，我应该做类似

的事情

var month = $('#ulID li').data('mes');

但是我不知道如何将它们变成阵列，以及如果发生不止一次，如何确保它们不重复。非常感谢任何帮助..

编辑：此处的工作代码http://bit.ly/16xI0yV点击“ordenar”旁边的白色按钮来测试排序功能

Answer 1

See demo here。所有行都通过以下评论解释。

// gets all `data-mes` into an array
var months = $('#ulID li').map(function() { return $(this).data('mes'); }).get();
// remove repeated meses
months = months.filter(function(e, p) { return months.indexOf(e) == p; });

// sorts the months
var order = ['jan','fev','mar','abr','mai','jun','jul','ago','set','out','nov','dez'];
orderedMonths = months.sort(function(a,b){ return order.indexOf(a) - order.indexOf(b); });

// add them, ordered, to the <select> with id #selectMes
$.each(orderedMonths, function(_, v) {
    $('#selectMes').append($('<option>').val(v).text(v));
});

Answer 2

您可以使用以下内容：

<ul id="ulID">
    <li class="mix evento" data-mes="jan">Jan</li>
    <li class="mix evento" data-mes="feb">Feb</li>
    <!-- etc... -->
</ul>
<select></select>

JS：

var months = [], $select = $('select');
$('#ulID li').each(function () {
    var mes = $(this).data('mes');
    if ($.inArray(mes, months) === -1) {
        months.push(mes);
        $select.append('<option value="'+mes+'">'+mes+'</option>');
    }
});

循环遍历所有li并检查其data-mes属性。每次出现新值时，它都会添加到months数组中。将针对此数组检查每个值，以确保不会处理相同的值两次。

如果该值是唯一的，则会在选择菜单中添加一个额外选项。

这里有效：http://jsfiddle.net/cns3b/

使用jquery通过data-attribute创建选项而不重复

2 个答案: