在下面的代码中,我有一个函数,它将搜索一个包含日期、公园和相应的公园时间的二维数组。
它应该返回控制台在引导-数据交换中选择的日期的公园时间,以及位于二维数组的以下两行中的以下两个条目(您会注意到数据将集中在3中,因为有三个公园要报告小时数)。
但是,控制台没有显示任何内容。我是走错路了,还是代码中有错误?
<head>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker3.css">
</head>
<body>
<div id="calendar-container"></div> <!-- 9/1/2019 has been selected -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
</body>
function findParkHours() {
var calendarDate = $("#calendar-container").datepicker('getFormattedDate');
var hoursTable = [
["9/1/2019","USF","9a","9p"],
["9/1/2019","IOA","9a","9p"],
["9/1/2019","UVB","10a","7p"],
["9/2/2019","USF","9a","9p"],
["9/2/2019","IOA","9a","9p"],
["9/2/2019","UVB","10a","7p"],
["9/3/2019","USF","9a","9p"],
["9/3/2019","IOA","9a","9p"],
["9/3/2019","UVB","10a","6p"]
];
// iterate through rows
for (var i = 0, len1 = hoursTable.length; i < len1; i++) {
// iterate through columns
for (var j = 0, len2 = hoursTable[i].length; j < len2; j++) {
// if the cell equals the datepicker date...
if (hoursTable[i][j] === calendarDate) {
// return the next three rows to the console
for (var k = 0, len3 = 3; k < len3; k++) {
// takes i and adds k to find the next two rows in addition to i
i + k;
// writes to console the column items adjacent to j column where
// the calendar date key is stored
console.log(hoursTable[i][j+1] +
": " +
hoursTable[i][j+2] +
"-" +
hoursTable[i][j+3]);
// expected result IF 9/1/2019 is selected:
// USF: 9a-9p
// IOA: 9a-9p
// UVB: 10a-7p
}
}
}
}
}
$("#calendar-container").datepicker( {
maxViewMode: 1,
todayHighlight: true,
format: 'm/d/yyyy'
}).on('changeDate', function() {
findParkHours();
});
发布于 2019-08-14 17:15:45
为了得到您想要的结果,我做了一些修改,这里是一个片段,我认为您必须检查/调试数据报头值,console.log(calendarDate)可能很有用。
编辑:我添加了数据报警器
function findParkHours(calendarDate) {
var hoursTable = [
["9/1/2019", "USF", "9a", "9p"],
["9/1/2019", "IOA", "9a", "9p"],
["9/1/2019", "UVB", "10a", "7p"],
["9/2/2019", "USF", "9a", "9p"],
["9/2/2019", "IOA", "9a", "9p"],
["9/2/2019", "UVB", "10a", "7p"],
["9/3/2019", "USF", "9a", "9p"],
["9/3/2019", "IOA", "9a", "9p"],
["9/3/2019", "UVB", "10a", "6p"]
];
for (var i = 0, len1 = hoursTable.length; i < len1; i++) {
for (var j = 0, len2 = hoursTable[i].length; j < len2; j++) {
if (hoursTable[i][j] === calendarDate) {
for (var k = 0, len3 = 3; k < len3; k++) {
var l = i + k;
console.log(hoursTable[l][j + 1] + ": " + hoursTable[l][j + 2] + "-" + hoursTable[l][j + 3]); //writes to console the column items adjacent to j column where the calendar date key is stored
//expected result IF 9/1/2019 is selected:
//IOA: 9a-9p
//UVB: 10a-7p
//USF: 9a-9p
}
return;
}
}
}
}
$("#calendar-container").datepicker( {
maxViewMode: 1,
todayHighlight: true,
format: 'm/d/yyyy',
}).on('changeDate', function() {
var calendarDate = $("#calendar-container").datepicker('getFormattedDate');
console.log(calendarDate);
findParkHours(calendarDate);
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<div id="calendar-container"></div> <!-- 9/1/2019 has been selected -->
https://stackoverflow.com/questions/57499064
复制相似问题