html - Change text of a tag when an option selected using Javascript -
i want make translations on small site using javascript. change tag content id or smth that. not sure how should do, kinda understand how works... want create files strings & translations each langauge.
so, there select tag has options...
<select> <option id="ru">russian</option> <option id="en">english</option> </select>
and there content has translated dependingly on selected option...
<div> <span id="stringname">your name en</span>: viktor <span id="stringphone">your phone en</span>: +7 900 00 00 00 <span id="stringemail">your e-mail en</span>: the_great_russia@russia.ru </div>
and localization files like...
ru.js
stringname: "your name ru" stringphone: "your phone ru" stringemail: "your e-mail ru"
en.js
stringname: "your name en" stringphone: "your phone en" stringemail: "your e-mail en"
i have searched need, couldn't find.
hope me :) thanks.
here simple example of how can work using change event on select , few global objects containing language strings.
for own site can move language objects own files , include them page
var langru = { stringname: "your name ru", stringphone: "your phone ru", stringemail: "your e-mail ru" }; var langen = { stringname: "your name en", stringphone: "your phone en", stringemail: "your e-mail en" }; function changelang(lang) { document.queryselectorall('[lang-change]').foreach(function(el) { el.innertext = window['lang'+lang][el.getattribute('lang-change')]; }); } changelang('en');
<select onchange="changelang(this.value)"> <option value="ru">russian</option> <option value="en" selected>english</option> </select> <br><br><br> <div> <span lang-change="stringname">your name</span>: viktor<br> <span lang-change="stringphone">your phone</span>: +7 900 00 00 00<br> <span lang-change="stringemail">your e-mail</span>: the_great_russia@russia.ru<br> </div>
Comments
Post a Comment