天天看点

根据日期筛选

<!DOCTYPE html>
<html >

<head>
    <meta charset="UTF-8">
    <title>日期筛选demo</title>
</head>

<body>
    起始查询时间:
    <input type="text" id="start-time">
     结束查询时间:
    <input type="text" id="end-time">
    <button id="share-time-btn">查询</button>
    <table>
        <thead>
            <tr>
                <th>时间</th>
                <th>性别</th>
                <th>暂住地</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>2015-10-01</td>
                <td>男</td>
                <td>浙江宁波</td>
            </tr>
            <tr>
                <td>2016-06-06</td>
                <td>女</td>
                <td>浙江杭州</td>
            </tr>
            <tr>
                <td>2016-06-09</td>
                <td>男</td>
                <td>湖南长沙</td>
            </tr>
        </tbody>
    </table>
</body>
<script src="jquery-1.11.1.js"></script>
<script>
$("#share-time-btn").on("click", function() {
    ckdate()
})

function ckdate() {
    var endtime = $('#end-time').val();
    var starttime = $('#start-time').val();
    var start = new Date(starttime.replace("-", "/").replace("-", "/"));
    var end = new Date(endtime.replace("-", "/").replace("-", "/"));
    if (end < start) {
        alert('结束日期不能小于开始日期!');
        $('#end-time').focus();
        return false;
    } else {
        var listData = $("table tbody tr"),
            i = 0;
        listData.hide();
        for (; i < listData.length; i++) {
            var listTime = listData.eq(i).find("td:first").text();
            listTime = new Date(listTime.replace("-", "/").replace("-", "/"));
            if (listTime >= start && listTime <= end) {
                listData.eq(i).show()
            }
        }

    }
}
</script>

</html>
           

继续阅读