Изменение URL через выбор HTML

Question

Каков наилучший способ изменить ваш URL через выбор HTML?

<select>
<option selected="selected">Change to URL X</option>
<option>Change to URL Y</option>
</select>

Какой Javascript следует использовать?

Answer 1

<script type="text/javascript">
function navigateTo(sel, target, newWindow) {
    var url = sel.options[sel.selectedIndex].value;
    if (newWindow) {
        window.open(url, target, '--- attributes here, see below ---');
    } else {
        window[target].location.href = url;
    }
}
</script>

<select onchange="navigateTo(this, 'window', false);">
<option selected="selected" value="http://www.example.com/#X">Change to URL X</option>
<option value="http://www.example.com/#Y">Change to URL Y</option>
</select>

Некоторые полезные значения target могут быть 'window' (текущее окно) или 'top' (для выхода из набора фреймов или фрейма). Если вы хотите открыть новое окно, вы можете использовать navigateTo(this, 'someWindow', true);

Значение '--- attribute ---' устанавливается с использованием различных свойств, как задокументировано здесь для Mozilla и здесь для IE . Например:

'height=300,width=400,top=100,left=100,statusbar=0,toolbar=1'

Answer 2

Если у вас есть jQuery, вы можете сделать ...

JavaScript:

$ ('# select_url'). Change (function (evnt) {location.href = $ (this) .val ();});

HTML:

...

Answer 3

добавив, например, что-то подобное в заголовок

<script language="JavaScript" type="text/javascript">
function jumpMenu(targ,selObj,restore){ 
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
}
</script>

, и ваше поле выбора будет выглядеть следующим образом

<select onchange="jumpMenu('parent',this)>
<option selected="selected">Change to URL X</option>
<option value="http://www.example.com">Change to URL Y</option>
</select>