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

Popular posts from this blog

resizing Telegram inline keyboard -

command line - How can a Python program background itself? -

php - "cURL error 28: Resolving timed out" on Wordpress on Azure App Service on Linux -