J'espère que quelqu'un peut m'aider avec une solution à ce problème. J'écris un JavaScript pour afficher l'une des 20 salutations chaque mois pendant 20 mois consécutifs avant le début des salutations. Vous trouverez ci-dessous la matrice de GreetingDétails:
var m = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September','October', 'November', 'December'];
var y = [];
var d = new Date();
//var test = new Date(2020, 1, 1);
// This for loop adds the years to the y-array
for (var i = 0; i < addYears; i++) {
y.push(startYear++);
}
//alert(m.length);
//alert(y.length);
for (var i = 0; i < y.length; i++) {
if (d.getFullYear() === y[i]) {
for (var j = 0; j < GreetingDetails.length; j++) {
if (m[d.getMonth()] === m[j]) {
GreetingBuilder = GreetingDetails[j];
}
}
}
}
var GreetingBuilder;
GreetingElements = {
topSection: function () {
var holder = document.createElement("section");
holder.id = "required-greeting";
return holder;
},
accessabilityP: function () {
var holder = document.createElement("p");
holder.classList.add("visuallyhidden");
holder.innerText = "The following is a greeting given in one of 20 foreign languages.";
return holder;
},
greetingContainer: function () {
var holder = document.createElement("dl");
holder.id = "language-greeting";
return holder;
},
greetingDT: function () {
var holder = document.createElement("dt");
holder.classList.add("greeting");
return holder;
},
greetingLink: function () {
var holder = document.createElement("a")
holder.href = GreetingBuilder.CommerceLink;
holder.classList.add("language-link");
holder.text = GreetingBuilder.Greeting;
return holder;
},
audioContainer: function () {
var holder = document.createElement("dd");
holder.classList.add("speaker");
return holder;
},
audioPlayer: function () {
var holder = document.createElement("audio");
holder.id = GreetingBuilder.Language.toLowerCase().replace(" ", "-");
holder.src = GreetingBuilder.AudioPath;
holder.preload = "auto";
return holder;
},
audioButton: function () {
var holder = document.createElement("button");
holder.classList.add("pronunciation");
holder.onclick = function () {
document.getElementById(GreetingElements.audioPlayer().id).play();
};
holder.innerText = "Listen to pronunciation";
return holder;
},
languageNameDD: function () {
var holder = document.createElement("dd");
holder.classList.add("language");
holder.innerText = "(" + GreetingBuilder.Language + ")";
return holder;
},
languageTranslationDD: function () {
var holder = document.createElement("dd");
holder.classList.add("translation");
holder.innerText = '"' + GreetingBuilder.Translation + '"';
return holder;
},
getFullGreetingSection: function () {
var sectionInstance = this.topSection();
var greetingDTInstance = this.greetingDT();
var greetingContainerInstance = this.greetingContainer();
var audioContainerInstance = this.audioContainer();
greetingDTInstance.appendChild(this.greetingLink());
greetingContainerInstance.appendChild(greetingDTInstance);
audioContainerInstance.appendChild(this.audioPlayer());
audioContainerInstance.appendChild(this.audioButton());
greetingContainerInstance.appendChild(audioContainerInstance);
greetingContainerInstance.appendChild(this.languageNameDD());
greetingContainerInstance.appendChild(this.languageTranslationDD());
sectionInstance.appendChild(this.accessabilityP());
sectionInstance.appendChild(greetingContainerInstance);
return sectionInstance;
}
}
document.getElementsByClassName("back-to-top")[0].insertAdjacentElement('afterend', GreetingElements.getFullGreetingSection());
4 Réponses :
Seulement 12 mois Alors seulement 12 valeurs uniques à travailler mais ont besoin de 20? Utilisez l'année!
2020 = 0 2021 = 1
Désigner une date dans le passé à partir de laquelle vous pouvez compter les mois. Ensuite, prenez les mois qui se sont écoulés depuis à l'heure et le mod de la longueur de votre réseau de salutations.
Essayez de régler "Pastdate" pour simuler le passage du temps et obtenir des salutations différentes. P>
p>
var greetings = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19].map (x=> "Greeting #" + x);
var currentDate = new Date();
var pastDate = new Date("2018-10-01"); // pick arbitrary point in past as the "first" month
var differenceInYears = currentDate.getYear() - pastDate.getYear(); // 20 years ago
var index = differenceInYears * 12 + currentDate.getMonth() - pastDate.getMonth(); // how many months ago we "started" counting
console.log(greetings[index%greetings.length]);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type='date' id="curdate" /> <button type="button" onclick='showmessage()'>Show</button> <div id="output"> </div>
Premièrement, laissez-moi vous dire merci à tous ceux qui ont répondu. Votre Insight m'a aidé à comprendre ce que je faisais mal.
J'ai trouvé la réponse dans la réponse de Nawed Khan et de Ferenc. Je pensais que certains mathématiques avec les années et les mois étaient nécessaires, mais je ne pouvais penser à la formule à utiliser. J'ai utilisé la formule de la méthode de MonthDiff () de Khan, comme je l'ai préféré briser la formule en deux morceaux. P> une fois fait, comme il l'a fait dans sa réponse, j'ai assigné le DIFF Comme l'indice de GreetingDétails ... GreetingDétails [DIFF] et Viola, la magie s'est produite. Cela a bien fonctionné pour un peu ... Jusqu'à ce que je puisse avoir au cours de 20 ans, j'ai commencé à obtenir la mauvaise salutation. Le problème était dans la boucle tandis que dans la réponse de Khan. Donc, je l'ai changé pour soustrayez GreetingDétails.Length (longueur de 20), et j'ai eu le bon de vœux à chaque fois. P> var todayDate = new Date();
var startDate = new Date(2020, 0)
var diff = todayDate.getMonth() - startDate.getMonth() + (12 * (todayDate.getFullYear() - startDate.getFullYear()));
var link = "url";
var GreetingBuilder;
var GreetingDetails = [
{// index0
Greeting: "Foreign Greeting 0",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation0.mp3",
CommerceLink: link
}, // index0
{// index1
Greeting: "Foreign Greeting 1",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation1.mp3",
CommerceLink: link
}, // index1
{// index2
Greeting: "Foreign Greeting 2",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation2.mp3",
CommerceLink: link
}, // index2
{// index3
Greeting: "Foreign Greeting 3",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation3.mp3",
CommerceLink: link
}, // index3
{// index4
Greeting: "Foreign Greeting 4",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation4.mp3",
CommerceLink: link
}, // index4
{// index5
Greeting: "Foreign Greeting 5",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation5.mp3",
CommerceLink: link
}, // index5
{// index6
Greeting: "Foreign Greeting 6",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation6.mp3",
CommerceLink: link
}, // index6
{// index7
Greeting: "Foreign Greeting 7",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation7.mp3",
CommerceLink: link
}, // index7
{// index8
Greeting: "Foreign Greeting 8",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation8.mp3",
CommerceLink: link
}, // index8
{// index9
Greeting: "Foreign Greeting 9",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation9.mp3",
CommerceLink: link
}, // index9
{// index10
Greeting: "Foreign Greeting 10",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation10.mp3",
CommerceLink: link
}, // index10
{// index11
Greeting: "Foreign Greeting 11",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation11.mp3",
CommerceLink: link
}, // index11
{// index12
Greeting: "Foreign Greeting 12",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation12.mp3",
CommerceLink: link
}, // index12
{// index13
Greeting: "Foreign Greeting 13",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation13.mp3",
CommerceLink: link
}, // index13
{// index14
Greeting: "Foreign Greeting 14",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation14.mp3",
CommerceLink: link
}, // index14
{// index15
Greeting: "Foreign Greeting 15",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation15.mp3",
CommerceLink: link
}, // index15
{// index16
Greeting: "Foreign Greeting 16",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation16.mp3",
CommerceLink: link
}, // index16
{// index17
Greeting: "Foreign Greeting 17",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation17.mp3",
CommerceLink: link
}, // index17
{// index18
Greeting: "Foreign Greeting 18",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation18.mp3",
CommerceLink: link
}, // index18
{// index19
Greeting: "Foreign Greeting 19",
Language: "Foreign Language",
Translation: "English Translation",
AudioPath: "/Content/Greetings/Pronunciation19.mp3",
CommerceLink: link
} // index19
];
while (diff >= GreetingDetails.length) {
diff -= GreetingDetails.length;
}
GreetingElements = {
topSection: function () {
var holder = document.createElement("section");
holder.id = "required-greeting";
return holder;
},
accessabilityP: function () {
var holder = document.createElement("p");
holder.classList.add("visuallyhidden");
holder.innerText = "The following is a greeting given in one of 20 foreign languages.";
return holder;
},
greetingContainer: function () {
var holder = document.createElement("dl");
holder.id = "language-greeting";
return holder;
},
greetingDT: function () {
var holder = document.createElement("dt");
holder.classList.add("greeting");
return holder;
},
greetingLink: function () {
var holder = document.createElement("a")
holder.href = GreetingBuilder.CommerceLink;
holder.classList.add("language-link");
holder.text = GreetingBuilder.Greeting;
return holder;
},
audioContainer: function () {
var holder = document.createElement("dd");
holder.classList.add("speaker");
return holder;
},
audioPlayer: function () {
var holder = document.createElement("audio");
holder.id = GreetingBuilder.Language.toLowerCase().replace(" ", "-");
holder.src = GreetingBuilder.AudioPath;
holder.preload = "auto";
return holder;
},
audioButton: function () {
var holder = document.createElement("button");
holder.classList.add("pronunciation");
holder.onclick = function () {
document.getElementById(GreetingElements.audioPlayer().id).play();
};
holder.innerText = "Listen to pronunciation";
return holder;
},
languageNameDD: function () {
var holder = document.createElement("dd");
holder.classList.add("language");
holder.innerText = "(" + GreetingBuilder.Language + ")";
return holder;
},
languageTranslationDD: function () {
var holder = document.createElement("dd");
holder.classList.add("translation");
holder.innerText = '"' + GreetingBuilder.Translation + '"';
return holder;
},
getFullGreetingSection: function () {
var sectionInstance = this.topSection();
var greetingDTInstance = this.greetingDT();
var greetingContainerInstance = this.greetingContainer();
var audioContainerInstance = this.audioContainer();
greetingDTInstance.appendChild(this.greetingLink());
greetingContainerInstance.appendChild(greetingDTInstance);
audioContainerInstance.appendChild(this.audioPlayer());
audioContainerInstance.appendChild(this.audioButton());
greetingContainerInstance.appendChild(audioContainerInstance);
greetingContainerInstance.appendChild(this.languageNameDD());
greetingContainerInstance.appendChild(this.languageTranslationDD());
sectionInstance.appendChild(this.accessabilityP());
sectionInstance.appendChild(greetingContainerInstance);
return sectionInstance;
}
}
GreetingBuilder = GreetingDetails[diff];
document.getElementsByClassName("back-to-top")[0].insertAdjacentElement('afterend', GreetingElements.getFullGreetingSection());
Il semble que
(année * 12 + mois)% 20 est tout ce dont vous avez besoin pour obtenir l'index.