<option value="-1" selected="">Выберите регион</option>
<option value="0">Другой</option>
<option id="2" value="2"></option>
<option id="1" value="1">Калининград</option>
<option id="2" value="3">Сувалкия</option>
<option id="2" value="4">Жемайтия</option>
<option id="1" value="5">Нижегородская </option>
<option id="1" value="6">Воронежская</option>
такого быть не может.
пиши им name чтоли. но не id. элемент с идентификатором
должен быть уникальным!
скрипт лёгкий до ужаса... сам чтоли не мог написать?
выложу тут . если что - еще лежит на
fiddle
Пример: запускай.
<!DOCTYPE HTML>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<select size="1" name="country" id="country">
<option value="-1" selected disabled>Выберите страну</option>
<option value="0">Другая</option>
<option value="1">Россия</option>
<option value="2">Литва</option>
</select>
<select size="1" name="region" id="region">
<option value="-1" selected="">Выберите регион</option>
<option value="0">Другой</option>
<option id="2" value="2"></option>
<option id="1" value="1">Калининград</option>
<option id="2" value="3">Сувалкия</option>
<option id="2" value="4">Жемайтия</option>
<option id="1" value="5">Нижегородская </option>
<option id="1" value="6">Воронежская</option>
</select>
<script>
var sels = {
'country' : document.getElementById('country'),
'region' : document.getElementById('region')
};
var database = {};
var currentOption = {}, i, b;
for(i = 0; i < sels.country.options.length; i += 1 ) {
currentOption.country = sels.country.options[ i ];
database[ currentOption.country.value ] = [];
for(b = 0; b < sels.region.options.length; b += 1 ) {
currentOption.region = sels.region.options[b]
if( currentOption.country.value === currentOption.region.id && currentOption.region.text.length !== 0 ){
database[ currentOption.country.value ].push( currentOption.region );
}
};
};
sels.region.style.display = 'none';
sels.region.options.length = 0;
sels.country.onchange = function(){
sels.region.options.length = 0;
sels.region.style.display = 'inline';
var optionsArray = database[ this.value ], i;
for( i = 0; i < optionsArray.length; i += 1 ){
sels.region.options.add( optionsArray[i] );
}
};
</script>
Внимание! добавление в хеш (читай : соответствие делается так )
currentOption.country.value === currentOption.region.id && currentOption.region.text.length !== 0
т.е. если у них
одинаковы value (у страны)
и id ( у региона)
и если в этой опции есть какой-то текст
