选择更改值时如何替换脚本标记的源

Question

I am new to javascript and I need some help.

I have two javascript files that run when the page is loaded:

    <script id="gvkbjs01" src="GVKB03_files/en_a.js" type="text/javascript" ></script>
    <script id="gvkbjs02" src="GVKB03_files/en_b.js" type="text/javascript" ></script>

I have a select drop down:

            <select lang="en" onchange="loadGVKBJS(this.value)" >
                <option value="" label=" Select a language" selected="selected" />
                <option value="af" label="Afrikaans / Afrikaans" />
                <option value="sq" label="Albanian / shqipe" />
                <option value="am" label="Amharic / አማርኛ" />
                <option value="ar" label="Arabic / العربية" />
                ..........

How do I change the javascript source of my two javascript files from the select drop down list that will then call the different js files?

Answer 1

Give an id to the dropdown, for Instance 'lang', after create a function that will read the value of the dropdown when it changes, then concatenate the value to generate the source of the file, finally find and replace the source of your old scripts. (I suppose your script tag is in the head).

function generateSrc(){

 var lang = document.getElementById('lang').value;
 var src1 = 'GVKB03_files/'+lang+'_a.js';
 var src2 = 'GVKB03_files/'+lang+'_b.js';

 //Replace src from old scripts in head
 var headElms = document.getElementsByTagName("head")[0].children;
 var found = 0
 for(var i = 0; i < headElms.length; i++) {
    if(headElms[i].tagName == 'SCRIPT') {
           src_name = headElms[i].src;
           if(src_name.search("GVKB03_files") > 0 && found == 0){
             found++;
             headElms[i].src = src;
           }else if(src_name.search("GVKB03_files") > 0 && found == 1){
             headElms[i].src = src2; 
           }
     }
  }

}

on Html:

<select id="lang" lang="en" onchange="generateSrc()" >