location.hash в теге select

Question

Я создал страницу со списком адресов, распределенных по итальянским провинциям.
В верхней части страницы у меня есть тег <select> со списком всех провинций <option>, который я назначил этому событию <select> onChange для создания различных URL-адресов для каждая провинция.

<form class="form" action="java-script:update();">  
        <select name="cities" id="cities" onchange = "update(); location.hash = '?id=' + this.value">  
                 <option value = "Bologna">Bologna</option>  
                 <option value = "Milano">Milano</option>  
                 <option value = "Roma">Roma</option> 
        </select> 
</form>

1011 *
*

Моя проблема:

Например, если я скопирую ссылку другой провинции (например, http://mywebsite.it/page.html#?id=Roma), открою новую вкладку и вставлю ее в адресную строку, а я отправляю, всегда напоминает мне позицию на первой опция (в данном случае Болонья). Зачем?

Спасибо! и извините за мой плохой английский.

Answer 1

Вы вообще не устанавливаете выбранную опцию, вы просто меняете хеш, когда пользователь меняет выбранную опцию. Ничего необычного не происходит, потому что вы не используете хеш повторно.

Если вы хотите выбрать текущую опцию, например, при загрузке страницы, вам нужно выполнить JavaScript:

<script>
window.onload = function() {
    var city = location.hash.substring(5); // strip the #?id=
    var elem = document.getElementById('cities');
    for(var i = 0 ; i < elem.options.length; i++) {
        if(elem.options[i].value == city) {
            elem.selectedIndex = i;
            break;
        }
    }
};
</script>

Также, чтобы использовать JavaScript в URL, используйте javascript:, а не java-script:.

http://jsfiddle.net/Ez8dY/1/ (выберите город, затем перезагрузите кадр)