根据当前日期jQuery按顺序显示即将到来的日期
Show upcoming dates in order based on current date jQuery
我正在尝试获取当前日期,然后首先订购日期最接近div的日期。
我已经设法获得了当前日期并将其格式化,但我不确定如何进行订购?
这是我的尝试,但似乎没有订购它们或任何
<div id="dates">
<div class="date"><span>10 September 2016</span></div>
<div class="date"><span>22 July 2016</span></div>
<div class="date"><span>29 August 2016</span></div>
<div class="date"><span>28 July 2016</span></div>
<div class="date"><span>5 August 2016</span></div>
</div>
var current = new Date();
console.log(current);
var months = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
var elems = $.makeArray($(".date"));
var d = current.getDate();
var m = months[current.getMonth()];
var y = current.getFullYear();
var formattedDate = d + " " + m + " " + y;
console.log(formattedDate);
elems.sort(function(a, b) {
return formattedDate > elems.text() );
});
$("#dates").html(elems);
感谢
要实现所需,将值转换为日期并与当前日期进行比较要容易得多。从那里,您可以sort()
.date
元素,append()
它们到它们的容器,如下所示:
var now = new Date();
$(".date").sort(function(a, b) {
var aDiff = new Date($(a).text().trim()) - now;
var bDiff = new Date($(b).text().trim()) - now;
return aDiff < bDiff ? -1 : aDiff > bDiff ? 1 : 0;
}).appendTo('#dates').filter(function() {
return new Date($(this).text().trim()) - now < 0;
}).appendTo('#dates');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="dates">
<div class="date"><span>10 September 2016</span></div>
<div class="date"><span>22 July 2016</span></div>
<div class="date"><span>29 August 2016</span></div>
<div class="date"><span>28 July 2016</span></div>
<div class="date"><span>5 August 2016</span></div>
</div>
基于当前日期的最近日期
var element = $.makeArray($(".date"));
var array = [];
var current = new Date();
element.sort(function(a,b){
var c = new Date($(a).text());
var d = new Date($(b).text());
return c-d;
});
for(var i in element){
var d = new Date($(element[i]).text());
if(d >= current){
$("#sorted").append(element[i])
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dates">
<div id="10 September 2016" class="date"><span>10 September 2016</span></div>
<div id="22 July 2016" class="date"><span>22 July 2016</span></div>
<div id="29 August 2016" class="date"><span>29 August 2016</span></div>
<div id="28 July 2016" class="date"><span>28 July 2016</span></div>
<div id="5 August 2016" class="date"><span>5 August 2016</span></div>
</div>
<h1>after sort</h1>
<div id="sorted"></div>
相关文章:
- 从桌面读取python文件时高亮显示代码
- 使用JS如何动态更改显示的html文件中的文本背景颜色
- 如何在生成下载文件时显示加载动画
- React重新渲染但未显示正确的组件
- nodejs-expressjs上传图像并显示它们
- 使用JSP从服务器检索和显示图像
- 根据即将到来的生日进行排序
- jssor附近的滑块不透明度即将到来的照片
- 获取日期对象池的下一个即将到来的日期
- 对于即将到来的Loop
- 为即将到来的导航菜单设置动画
- JavaScript查找下一个即将到来的日期
- Javascript:如何根据即将到来的索引值递归地分组数组
- Javascript只使用即将到来的工作日——忽略周末
- MongoDB:如何使用MongoDB获取今天,即将到来和过去的生日列表
- JS读取即将到来的数组元素失败
- 立即将csv文件中的数据显示为可手动保存
- 使用php,我应该如何从数组中获取即将到来的日期并将其传递给javascript
- 根据当前日期jQuery按顺序显示即将到来的日期
- Phonegap的UrbanAirship即将到来