Javascript 在表单选择的日期范围字符串中查找当前日期
嗨,这是一个棘手的问题: 我有一个json对象,通过这种方式创建一个选择表单字段:Javascript 在表单选择的日期范围字符串中查找当前日期,javascript,forms,date,selected,Javascript,Forms,Date,Selected,嗨,这是一个棘手的问题: 我有一个json对象,通过这种方式创建一个选择表单字段: for(var i = 0; i < jsonData.vpcourse[0].items.length; i++) { $('#kw').append('<option value="'+jsonData.vpcourse[0].items[i].datum+'">'+jsonData.vpcourse[0].items[i].datum+'</option>');
for(var i = 0; i < jsonData.vpcourse[0].items.length; i++) {
$('#kw').append('<option value="'+jsonData.vpcourse[0].items[i].datum+'">'+jsonData.vpcourse[0].items[i].datum+'</option>');
console.log(jsonData.vpcourse[0].items[i].datum);
}
我的问题:添加的最后一个选项已被选中,但我需要选项选择实际日期的日期范围如下:
<option value="07.10.2013-01.11.2013">07.10.2013-01.11.2013</option>
<option value="09.09.2013-04.10.2013">09.09.2013-04.10.2013</option>
<option value="12.08.2013-06.09.2013">12.08.2013-06.09.2013</option>
<option value="15.07.2013-09.08.2013" selected="selected">15.07.2013-09.08.2013</option>
<option value="17.06.2013-12.07.2013">17.06.2013-12.07.2013</option>
<option value="20.05.2013-14.06.2013">20.05.2013-14.06.2013</option>
<option value="22.04.2013-17.05.2013">22.04.2013-17.05.2013</option>
<option value="25.03.2013-19.04.2013">25.03.2013-19.04.2013</option>
例如,最好的方法是直接在for循环中检查实际日期是否在日期范围07.10.2013-01.11.2013内,并将selected=selected添加到该附加中
这有可能吗
更新:
工作90%:D它选择以下选项:
<option value="12.08.2013-06.09.2013">12.08.2013-06.09.2013</option>
<option value="15.07.2013-09.08.2013">15.07.2013-09.08.2013</option>
<option value="17.06.2013-12.07.2013" selected="selected">17.06.2013-12.07.2013</option>
<option value="20.05.2013-14.06.2013">20.05.2013-14.06.2013</option>
但是,它应该是一种选择,那么有什么不对呢
更新2:
它是有效的,问题是我必须从月份变量中取-1
工作示例:
Thx转到LightStyle:我有一个非常优雅的解决方案供您使用,它非常清晰易懂,但我的建议是用作处理日期的插件助手,以及一个简单的插件,它被调用来为您计算范围 有了这些插件,您的代码可以简化为:
// Coming from json or whatever...
var dates = ["07.10.2013-01.11.2013",
"09.09.2013-04.10.2013",
"12.08.2013-06.09.2013",
"15.07.2013-09.08.2013",
"17.06.2013-12.07.2013",
"20.05.2013-14.06.2013",
"22.04.2013-17.05.2013",
"25.03.2013-19.04.2013"];
$(dates).map(function(i,item) {
// Split the dates
var datesSplit = item.split("-");
// Define dates and range
var start = moment(datesSplit[0], "DD.MM.YYYY");
var end = moment(datesSplit[1], "DD.MM.YYYY");
var today = moment();
var range = moment().range(start, end);
// Create Option
var option = $("<option>").text(item);
// Add parameter when today within range
if (today.within(range)) {
option.attr("selected", "selected");
}
$("select").append(option);
});
我认为您不会得到更容易理解和维护的代码。这是工作原理。只需创建三个日期对象,两个用于范围,一个用于当前值。然后检查当前值的毫秒是否在第一个日期的毫秒和最后一个日期的毫秒之间。我也有这个想法,但我如何从字符串创建日期对象,如:17.06.2013??将日期拆分,然后使用年-月-日期构造函数创建日期对象,如:new Dateyear,month,day。拆分将看起来像日期。拆分“.”,然后使用[0]访问它(日期,[1]访问月份,[2]访问年份。尝试了您的方式,但效果不理想:我更新了我的问题查找它:
var today = new Date();
for(var i = 0; i < jsonData.vpcourse[0].items.length; i++)
{
var testDate = jsonData.vpcourse[0].items[i].datum;
var n=testDate.split("-");
var x = n[0].split(".");
var y = n[1].split(".");
var smaller = new Date(x[2], x[1]-1, x[0]);
var bigger = new Date(y[2], y[1]-1, y[0]);
if (smaller <= today && today <= bigger) {
$('#kw').append('<option value="'+jsonData.vpcourse[0].items[i].datum+'" selected="selected">'+jsonData.vpcourse[0].items[i].datum+'</option>');
} else {
$('#kw').append('<option value="'+jsonData.vpcourse[0].items[i].datum+'">'+jsonData.vpcourse[0].items[i].datum+'</option>');
}
//console.log(jsonData.vpcourse[0].items[i].datum);
}
// Coming from json or whatever...
var dates = ["07.10.2013-01.11.2013",
"09.09.2013-04.10.2013",
"12.08.2013-06.09.2013",
"15.07.2013-09.08.2013",
"17.06.2013-12.07.2013",
"20.05.2013-14.06.2013",
"22.04.2013-17.05.2013",
"25.03.2013-19.04.2013"];
$(dates).map(function(i,item) {
// Split the dates
var datesSplit = item.split("-");
// Define dates and range
var start = moment(datesSplit[0], "DD.MM.YYYY");
var end = moment(datesSplit[1], "DD.MM.YYYY");
var today = moment();
var range = moment().range(start, end);
// Create Option
var option = $("<option>").text(item);
// Add parameter when today within range
if (today.within(range)) {
option.attr("selected", "selected");
}
$("select").append(option);
});