You are setting lang as a string.
if (language === "fr") {
lang = "fr"
}
else {
lang = "en"
}
So when you try to access “fr”.welcome it correctly states undefined.
Instead set it
if (language === "fr") {
lang = fr;
}
else {
lang = en;
}
function changeLanguage() {
var en = {
welcome: "Welcome!"
}
var fr = {
welcome: "Salut!"
}
if (event.target.value === "fr") {
lang = fr;
}
else {
lang = en;
}
// set translation
document.getElementById("welcome").innerHTML = lang.welcome;
}<script>
</script><input type="button" value="fr" onclick="changeLanguage()">
<input type="button" value="en" onclick="changeLanguage()">
<p id="welcome">Welcome!!</p>I’m actually trying to build a multilingual website using javascript.
Sound simple but i’m stuck with the function who always return undefined for a reason I don’t get.
When I debug it on Chrome lang is correctly initialized with “fr” if I click on the french button.
But when it has to read the value lang.welcome I always see “undefined”.
<script>
function changeLanguage(language) {
var en = {
welcome: "Welcome!"
}
var fr = {
welcome: "Salut!"
}
if (language === "fr") {
lang = "fr"
}
else {
lang = "en"
}
// set translation
document.getElementById("welcome").innerHTML = lang.welcome;
}
</script> <input type="button" value="fr" onclick="changeLanguage(this.value)">
<input type="button" value="en" onclick="changeLanguage(this.value)">
<p id="welcome">Welcome</p>It should be
@TylerRoper Thanks, it works. You can post it as an answer 🙂
It seems more like a typo or a duplicate, so I think in all honesty it would be better off just being deleted to reduce clutter 🙂
I can’t since someone answered the question :p But thanks 🙂