英文:
How to execute a script again after click button
问题
I have a HTML template with an external script to manage cookies permissions:
<!DOCTYPE html>
<html lang="fr">
<head>
<script id="consentementCookiesScript" src="https://static.desjardins.com/fw/cookie/scriptCookie.js"></script>
The cookies permissions' language is set according to the Lang attribute in the HTML tag.
I manage creating a button to dynamically change the Lang attribute:
<div id="toolbar" class="toolbar">
<div id="changeLangElement" style="color: white">Français</div>
</div>
through this function:
changeLangElement.onclick = function () {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
};
Is there any way to execute the script again with the right language after clicking the button?
英文:
I have a HTML template with an external script to manage cookies permissions:
<!DOCTYPE html>
<html lang="fr">
<head>
<script id="consentementCookiesScript" src="https://static.desjardins.com/fw/cookie/scriptCookie.js" ></script>
The cookies permissions' language is set according with the Lang att into the tag html.<br>
I manage creating a btn to change dynamically the Lang att:
<div id="toolbar" class="toolbar">
<div id="changeLangElement" style="color: white">Français</div>
</div>
through this function:
changeLangElement.onclick = function () {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
};
Is there any way to execute the script again with the right language after click the button?
答案1
得分: 1
我认为您需要为该按钮或div添加一个事件监听器，就像这样：
const changeLangElement = document.querySelector('#changeLangElement');
changeLangElement.addEventListener('click', () => {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
});
英文:
I think you have to add an Event listener attached to that button or div like this :
const changeLangElement = document.querySelector('#changeLangElement') ;
changeLangElement.addEventListener('click' , () => {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
}) ;
答案2
得分: 1
您可以将`currentLang`变量移到函数范围之外，或者像下面这样使用**闭包**：
```js
function createLangToggleHandler() {
let currentLang = "en";
return function () {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
};
}
const changeLangElement = document.getElementById("changeLang");
changeLangElement.onclick = createLangToggleHandler();
英文:
You can either move the currentLang variable outside of the function scope or use closure like so:
function createLangToggleHandler() {
let currentLang = "en";
return function () {
currentLang = currentLang === "fr" ? "en" : "fr";
translatePage(currentLang);
document.documentElement.lang = currentLang;
};
}
const changeLangElement = document.getElementById("changeLang");
changeLangElement.onclick = createLangToggleHandler();
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论