Question

我一直试图解决这个问题两天。也许有人暗示我？

我有两个div，每个div.news-list-item都有2个日期 - startdate和enddate。我想比较两个日期以检查它们是否相等。如果它们相等，则添加类show，如果不做其他事情。

问题是startDate总是空的或未定义的。

<div class="news-list-container row">   
    <div class="news-list-item nth-item-1">
        <span class="event-from">17.10.2014</span>
        <span class="event-to">19.10.2014</span>
    </div>

    <div class="news-list-item nth-item-2">
        <span class="event-from">07.12.2014</span>
        <span class="event-to">07.12.2014</span>
    </div>

    <div class="news-list-item nth-item-3">
        <span class="event-from">08.12.2014</span>
        <span class="event-to">08.12.2014</span>
    </div>   
</div>



$('.news-list-container').each(function() {
    var $children = $(this).children(),
        count = $children.size(),
        $item;
        $children.each(function(i) {
            $item = $(this).addClass('nth-item-' + (i + 1))

});

$(".news-list-item").each(function() {
    var startDate =  $(".event-from").val();
    var endDate = $(".event-to").val();

        if(startDate == endDate) {
                $(this).addClass("show");       
            } else {

            }
    }); 
    console.log("story " + startDate + " story");
    }); 
});

Answer 1

您需要将context this添加到$（＆＃34; .event-from＆＃34;）和$（＆＃34; .event-to＆＃34;）得到孩子的div。

此外，spans没有val（）而是text（）

var startDate =  $(".event-from",this).text();
var endDate = $(".event-to",this).text();

与

相同

$(this).find("span.event-from")...

更多信息：How to get the children of the $(this) selector?

我的例子

＆＃13;

$(function() {
  $(".news-list-container > .news-list-item").each(function() {
    var startDate = $(".event-from",this).text();
    var endDate   = $(".event-to",this).text();
    $(this).toggle(startDate != endDate);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="news-list-container row">   
    <div class="news-list-item nth-item-1">
        <span class="event-from">17.10.2014</span>
        <span class="event-to">19.10.2014</span>
    </div>

    <div class="news-list-item nth-item-2">
        <span class="event-from">07.12.2014</span>
        <span class="event-to">07.12.2014</span>
    </div>

    <div class="news-list-item nth-item-3">
        <span class="event-from">08.12.2014</span>
        <span class="event-to">08.12.2014</span>
    </div>   
</div>

＆＃13;

Answer 2

你可以试试这个

$(function(){

    $('.news-list-item').each(function() {

        if($('.event-from', this).text() == $('.event-to', this).text()) {

           $(this).addClass('show);

        } else {

            console.log('Not Equal');
        }

    });

});

Answer 3

相对于当前find

$(this)

使用text检索文字内容

这是一个有效的实时样本：

＆＃13;

$('.news-list-container').each(function() {
    var $children = $(this).children(), count = $children.size(), $item;
    $children.each(function(i) {
        $item = $(this).addClass('nth-item-' + (i + 1))
    });

    $(this).find(".news-list-item").each(function() {
        var startDate = $(this).find(".event-from").text();
        var endDate = $(this).find(".event-to").text();

        if(startDate == endDate) {
            $(this).show();       
        } else {
            $(this).hide(); 
        }
        console.log("story " + startDate + " story");
    }); 
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="news-list-container row">   
    <div class="news-list-item nth-item-1">
        <span class="event-from">17.10.2014</span>
        <span class="event-to">19.10.2014</span>
    </div>

    <div class="news-list-item nth-item-2">
        <span class="event-from">07.12.2014</span>
        <span class="event-to">07.12.2014</span>
    </div>

    <div class="news-list-item nth-item-3">
        <span class="event-from">08.12.2014</span>
        <span class="event-to">08.12.2014</span>
    </div>   
</div>

＆＃13;

jquery /比较列表中的日期

3 个答案: