1

各位晚安。
好的,所以我有<li>一些data-attributes,比如

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

我需要data-mes从该页面上的所有 li 中获取所有内容,并将它们添加到 select>option 中,但不重复它们(data-mes基本上是data-month,每个 li 代表一个带有某个日期的事件)。

这将用于按月 ( )使用美丽的MixitUp 插件过滤 Lidata-mes

好吧,我知道,要获得 1 个数据属性,我应该做类似的事情

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

但我不知道如何将它们放入一个数组中,以及如何确保它们在发生多次时不会重复。任何帮助深表感谢..

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

4

2 回答 2

2

在此处查看演示。所有行都通过下面的评论进行解释。

// 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));
});
于 2013-06-25T21:00:43.317 回答
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>');
    }
});

这将遍历所有lis 并检查它们的data-mes属性。每次出现新值时,它都会添加到months数组中。对照此数组检查每个值,以确保不会对相同的值进行两次处理。

如果该值是唯一的,则将一个额外的选项添加到选择菜单中。

它在这里工作:http: //jsfiddle.net/cns3b/

于 2013-06-25T21:04:58.023 回答