html select tag:on select get value from another select tag

时间:2016-12-19 14:01:06

标签: html function select

我有两个Select标签:第一个是动态填充php脚本(扫描我的非空文件夹)并给我国家代码如下:

         <select name="countries" id="countries"> 
         <option>fr</option>
         <option>gr</option>
         <option>it</option>
         <option>gr</option>
         <option>pl</option>
         <option>gb</option>
         <option>es</option>
         <option>pt</option>
                  ... 
         (dynamically populated from a php script)
    </select>

并且第二个SELECT是已填充其代码的countrie的完整列表:

    <select name="ctCodes" id="ctCodes">
    <option>--select--</option>
    <option value="fr">France</option>
    <option value="nl">Netherlands</option>
    <option value="bl">Belgium</option>
    <option value="rs">Russia</option>
                   ... 
      (full ready list with all countries and code as value)
    </select>

我不希望我的访客从第一个SELECT中选择,因为它只是代码(fr,de,..)但我希望他从全名列表中选择全名国家(法国,德国) ..)选项值会将他重定向到所选国家:例如,他选择德国,我的功能将带他:location.href =&#34; xxx.php#&#34; + element.value;)在这种情况下&#39; de&#39;。

我如何实现这一点:创建第三个SELECT标签,根据第一个标签从完整下拉列表中添加OPTIONS? ..有一个解决方案只是过滤第二个SELECT标签中的全名列表,只保留第一个加载的选项吗? ...我知道这是sql或ms-access的第二份工作!但是有可能用html和javascript做到吗? 我很感激所有答案。

1 个答案:

答案 0 :(得分:0)

在身份select

的第一个#country
var e = document.getElementById("country");
var value = e.options[e.selectedIndex].value;

在此代码中value将包含country name,如果它是值。

var textVar = e.options[e.selectedIndex].text;

如果国家/地区名称为text,则会将其存储在textVar

现在,您要使用标识为onchange的选项自动选择第二次选择使用country

现在在标识为ctCodes

的第二个选择中
var element = document.getElementById('ctCodes');
element.value = value;

使用此代码设置select的值。