我在jquery中迭代对象时遇到了一些问题。我相信在js文件的第25行中,holidays.date并没有选择我打算选择的内容。这就是,对于变量假日中的每个对象,检查是否有任何日期是今天的日期。如果不是运行追加,则运行泛型追加。
我如何修正选择器(holidays.date)来检查那些日期和今天的日期?
谢谢你们所有人。
$(document).ready(function() {
var today = new Date(),
month = today.getMonth(),
months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'),
date = today.getDate(),
monthDay = months[month] + ' ' + date;
var suHours = "We're Closed Today.",
mHours = "9:00am to 5:00pm",
tHours = "8:00am to 3:00pm",
wHours = "9:00am to 5:00pm",
thHours = "9:00am to 5:00pm",
fHours = "9:00am to 7:00pm",
sHours = "9:00am to 2:00pm";
var holidays = [
{date: 'May 10', hours: '8:00am to 12:00pm', message: 'Tuesday\'s Message - Merry Christmas!'},
{date: 'May 11', hours: '9:00am to 1:00pm', message: 'Wednesday\'s Message - Happy New Years!'},
{date: 'May 12', hours: '10:00am to 2:00pm', message: 'Thursday\'s Message - Happy Thanksgiving!'},
],
generic = "Open Right Now!";
function todayHoliday() {
if ( monthDay == holidays.date ) {
$.each( $(holidays), function() {
$('.today-holiday-hours em').append(this.hours);
$('.today-holiday-message em').append(this.message);
});
} else {
$('.today-holiday-hours em').append('Generic Hours');
$('.today-holiday-message em').append('Generic Message');
}
}
todayHoliday();
});*, body, html {
font-family: "Arial", sans-serif;
font-size: 15;
margin: 0;
padding: 0;
}
body {
margin: 20px;
}
h1, section {
margin: 20px 0;
}
h3 {
color: #aaa;
}
section p em {
color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HoursJS Holiday Version</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1 id="title">HoursJS Plugin Holiday Version v: 0.0.1</h1>
<hr>
<!-- Today is Holiday Hours & Message -->
<section>
<h3>Today is a Holiday:</h3>
<p class="today-holiday-hours"><em></em></p>
<p class="today-holiday-message"><em></em></p>
</section>
</body>
</html>
发布于 2016-05-10 23:07:11
要使用.each,您不需要“选择”您的假期,只需这样做:
var matchFound = false;
$.each(holidays, function() {
if ( monthDay == this.date ) {
matchFound = true;
$('.today-holiday-hours em').append(this.hours);
$('.today-holiday-message em').append(this.message);
}
});
if (!matchFound) {
$('.today-holiday-hours em').append('Generic Hours');
$('.today-holiday-message em').append('Generic Message');
}选择器($(something))用于选择DOM中的元素。在这种情况下,您已经有了一个数组,所以只需对其进行迭代。
编辑:我更新了函数,将if语句放入循环中,我认为这是想要的行为。我还根据所需行为的注释将else语句移出循环之外
发布于 2016-05-10 23:28:08
试试这个:
var isHoliday = false;
$.each( $(holidays), function() {
if ( monthDay == this.date )
{
$('.today-holiday-hours em').append(this.hours);
$('.today-holiday-message em').append(this.message); });
isHoliday = true;
}
}
if (!isHoliday )
{
$('.today-holiday-hours em').append('Generic Hours');
$('.today-holiday-message em').append('Generic Message');
}发布于 2016-05-10 23:05:05
我认为您可以使用grep函数。
var xyz = $.grep(holidays, function (n) {
return n.date === monthDay;
}); https://stackoverflow.com/questions/37150277
复制相似问题