Переадресация нескольких параметров URL-адреса

Question

У меня есть два блока выбора: один для города и другой для цвета. Что я хочу достичь, когда вы выбираете любой вариант из ЛЮБОГО выпадающего списка было бы перенаправить на URL-адрес http://domain.com/?city=CITY&color=COLOR

На первый я использовал этот подход:

<script type="text/javascript"> 
    function change_url(val) { 
     window.location=val; 
    } 
</script>    
<select id="city" onchange="change_url(this.value);"> 
    <option value="http://domain.com/?city=newyork">New York</option> 
    <option value="http://domain.com/?city=paris">Paris</option> 
</select> 

Это прекрасно работает, если у меня есть только одно поле выбора , но в этом случае я хочу передать несколько значений ящиков в url, и я НЕ хочу использовать кнопку отправки для этого!

Как мне изменить этот код?

<select id="city"> 
    <option value="newyork">New York</option> 
    <option value="paris">Paris</option> 
</select> 

<select id="color"> 
    <option value="blue">Blue</option> 
    <option value="red">Red</option> 
</select> 

Answer 1

Попробуйте FIDDLE

Javacript

function change_url(city,color) { 
     var baseURL = 'http://domain.com/?city=' + city + '&color=' + color; 
     window.location=baseURL; 
     //alert(baseURL); 
} 

$(function(){ 
     $('#city, #color').change(function(){ // attaching a handler to city and color dropdown list on Change 
      change_url($('#city').val(),$('#color').val()); 
     }); 
}); 

HTML

<select id="city"> 
    <option value="newyork">New York</option> 
    <option value="paris">Paris</option> 
</select> 

<select id="color"> 
    <option value="blue">Blue</option> 
    <option value="red">Red</option> 
</select> 

Надеется, что это работает для вас

Answer 2

<script type="text/javascript"> 
    function change_url(val) { 
     //you can use document.getElementById instead of jquery's api 
     var url = ""; 
     var color = $("#city").value(); 
     url += ("city=" + val + "&color=" + color) 
     window.location=url; 
    } 
</script>    
<select id="city" onchange="change_url(this.value);"> 
    <option value="http://domain.com/?city=newyork">New York</option> 
    <option value="http://domain.com/?city=paris">Paris</option> 
</select> 

<select id="color"> 
    <option value="blue">Blue</option> 
    <option value="red">Red</option> 
</select>