检查 html 数据属性中的多个值

Question

我有一个包含多个值的数据属性 (data-day="5,6,7")，我想将今天的日期与这些值进行比较。请在下面找到我创建的代码，但只有当我在数据属性中只有一个值时，它才有效。请问如何检查今天的日期并将其与属性中的多个值进行比较？

<script>
    jQuery(document).ready(function(JQuery){
        var date = new Date();
        var getday = date.getDay();

        var show = 'today';

        jQuery(".cd-gallery ul li").each(function() {
            var running_days = JQuery(this).data('day');

            if (getday == running_days) {
                JQuery(this).addClass('today');
            }
            else {
            }
        });

    });

    </script>
    <section class="cd-gallery">
        <ul>

                <li class="mix weekends" data-day="5,6,7" >

Answer 1

您可以使用 split() 将该逗号分隔的字符串转换为数组，然后使用 indexOf 在数组中查找匹配值。试试这个：

jQuery(document).ready(function($){
    var getday = new Date().getDay();
    var show = 'today';

    $(".cd-gallery ul li").each(function() {
        var running_days = $(this).data('day').split(',');
        if (running_days.indexOf(getday.toString()) != -1)
            $(this).addClass('today');
    });
});

Example fiddle

请注意 getDay() return 是星期几。今天是星期五，意味着它将 return 5。如果你想得到一个月中的第几天（今天是 17），使用 getDate().

Answer 2

var str = '5,6,7'; // = JQuery(this).data('day');
var daysArray = str.split(',');
for(...) {
    ...
}

或如@Roy McCrossan 所述，indexOf。最好检查值，但是。比较前可能需要修剪一天。

Answer 3

您可以 split 值并匹配您达到的条件

   jQuery(document).ready(function(JQuery){
        var date = new Date();
        var getday = date.getDay();
        var show = 'today';

        jQuery(".cd-gallery ul li").each(function() {
            var running_days = JQuery(this).data('day');
            var arr = running_days.split(',');
            $.each(arr, function( index, value ) {
               alert(value)
          });
            
        });

    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<section class="cd-gallery">
        <ul>

                <li class="mix weekends" data-day="5,6,7" >

Answer 4

你可以使用这个：

<script>
    jQuery(document).ready(function(JQuery){
        var date = new Date();
        var getday = date.getDay();

        var show = 'today';

        jQuery(".cd-gallery ul li").each(function() {
            var list_item = JQuery(this);
            var running_days = JQuery(this).data('day');
            var running_days_data = new Array();
            if(running_days){
                 running_days.split(',').each(function(i,val){
                     running_days_data.push(val);
                 });
            }

            if ($.inArray(getday, running_days_data) > -1;) {
                $(list_item).addClass('today');
            }
            else {
            }
        });    
    });
</script>

Answer 5

只需使用此选择器来匹配数据日属性中的日期。

jQuery(".cd-gallery li[data-day*=" + getday + "]").addClass("today");

试试这个，让我知道它是否适合你:)

检查 html 数据属性中的多个值

Checking multiple values in html data attribute

html

jquery

custom-data-attribute