javascript - jQuery - 如果两个条件的语句在两个条件都通过时添加一个类

Question

我正在尝试编写一个有 2 个条件的 if 语句。

条件一是看是否 <time>有类(class)class="overdue" 。

第二个条件是查看 <div> 内的日期时间是否相同以及 <a> 内的日期时间匹配。

当条件一和条件二都满足时，结果将是 <a>标签将被赋予红色类别，但前提是满足两个条件。

jsfiddle - http://jsfiddle.net/qk79jgL4/

HTML

<div><time class="overdue" datetime="2013-03-10">March 10th, 2013</time></div>
<div><time datetime="2013-03-11">March 11th, 2013</time></div>
<a href="#" class="cal-evt"><time datetime="2013-03-10">10</time></a>
<a href="#" class="cal-evt"><time datetime="2013-03-11">11</time></a>

CSS

.red {
    background-color:red;
}

jQuery

if ($("time").hasClass("overdue")) {

    $("a.cal-evt").addClass("red");

}

return false;

Answer 1

可以使用jquery的遍历方法，利用它们来定位你想要的元素

$("time.overdue").each(function(){  // for each time that has overdue class
    var time = $(this).attr('datetime'); // store its datetime value

    $("a.cal-evt").filter(function(){ // find all the cal-evt links that contain the same time
        return $('time', this).attr('datetime') == time;
    }).addClass("red"); // apply the red class on the filtered items

});

演示地址:http://jsfiddle.net/qk79jgL4/9/