여러 개의 선택 URL 매개 변수 리디렉션

Question

두 개의 선택 상자가 있습니다. 하나는 도시 용이고 다른 하나는 색상 용입니다.

<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> 

이 난 단 하나 개의 선택 상자가있는 경우 완벽하게 작동합니다 : 내가 뭘 달성하고자하면 모든 드롭 다운 메뉴에서 어떤 옵션을 선택하면 그것이 내가이 방법을 사용하고 있었다 처음에는 http://domain.com/?city=CITY&color=COLOR

를 URL로 리디렉션 할 것입니다 ,하지만이 경우에는 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

이 당신

,617을 위해 작동

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> 

희망을 FIDDLE

javacript 시도

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>