On state select изменить страну

Question

У меня есть два списка (одно из состояний) и одно из (стран). Я хочу, чтобы это было, когда пользователь выбирает Альберту, он устанавливает страну в Канаду и т. Д. И т. Д.

У меня есть следующий код JavaScript

var states = new Array(12) 

states[0] = "AB"; 
states[1] = "BC"; 
states[2] = "MB"; 
states[3] = "NB"; 
states[4] = "NL"; 
states[5] = "NT"; 
states[6] = "NV"; 
states[7] = "NS"; 
states[8] = "ON"; 
states[9] = "PE"; 
states[10] = "QC"; 
states[11] = "SK"; 
states[12] = "YK"; 

function oc(a) 
{ 
    var o = {}; 
    for(var i=0;i<a.length;i++) 
    { 
    o[a[i]]=''; 
    } 
    return o; 
} 

if(oc(document.forms[0].state_o.value) in states) { 
    document.forms[0].country_o.options("Canada").selected = true; 
} 

Государственный список

<select name="state_o" id="state_o"> 
                 <option value=''></option> 
<option value="AB" style='color: red'>Alberta</option> 
<option value="BC" style='color: red'>British Columbia</option> 
<option value="MB" style='color: red'>Manitoba</option> 
<option value="NB" style='color: red'>New Brunswick</option> 
<option value="NL" style='color: red'>Newfoundland</option> 
<option value='NT' style='color: red'>Northwest Territories</option> 
<option value='NV' style='color: red'>Nunavut</option> 
<option value="NS" style='color: red'>Nova Scotia</option> 
<option value="ON" style='color: red'>Ontario</option> 
<option value="PE" style='color: red'>Prince Edward Island</option> 
<option value="QC" style='color: red'>Quebec</option> 
<option value="SK" style='color: red'>Saskatchewan</option> 
<option value='YK' style='color: red'>Yukon Territory</option> 

Страна Список

<select name="country_o"> 
                <option value=''></option> 
                <option value="Canada">Canada</option> 
                <option value="United States">United States</option> 
                <option value="Europe">Europe</option> 
               </select> 

Теперь проблема в том, что, кажется, не работает. Я настраиваю массив, а затем преобразовываю его в объект с помощью oc-функции, а затем проверяю, находится ли он в списке объектов, и если для него выбрана правильная страна, выбранная для true.

Любая помощь?

Answer 1

Я не вижу назначений на событие onchange state-o, где может быть сделан целенаправленный выбор соответствующей страны.

Что касается этого решения? Я создаю object, где состояния связаны с соответствующей страной через индекс в поле выбора. Сам выбор запускается путем вызова функции selectCountry() в onchange -эвенте state-o.

var states = { 
    "AB": 1, // 1 = Canada 
    "NY": 2, // 2 = USA 
    // ... 
    "YK": 1 
}; 

function selectCountry(sel) { 
    document.getElementById("country_o").selectedIndex = states[sel.value]; 
} 
​ 


<select name="state_o" onchange="selectCountry(this)"> 
    <option value=""></option> 
    <option value="AB">Alberta</option> 
    <option value="YK">Yukon Territory</option> 
    <option value="NY">New York</option> 
    <!-- ... --> 
</select> 

<select name="country_o" id="country_o"> 
    <option value=""></option> 
    <option value="Canada">Canada</option> 
    <option value="USA">USA</option> 
    <!- ... --> 
</select> 

Небольшой пример на jsbin.com