傳遞下拉菜單選擇的值作爲查詢字符串URL

在一個HTML下拉值的選擇時，我想要觸發被定向到一個特定的URL和選擇價值被附加到URL作爲查詢字符串。如何在JavaScript或jQuery中實現？傳遞下拉菜單選擇的值作爲查詢字符串URL

<select id="hospitalDropDown"> 
      <option>All Hospitals</option> 
      <option>Dyer</option> 
     <option>Carmel</option> 
     <option>Indianapolis</option> 
     <option>Beech Grove</option> 
</select>

所以如果選擇代爾，結果應被引導到http://mysite.com/events.aspx?hosp=Dyer

有人能幫忙嗎？

來源

2011-12-28 Anju Thapa

jQuery中

$('#hospitalDropDown').on('change', function(e){ 
    document.location.href = "http://blah" + $(this).val(); 
});

編輯：改變「綁定」到現代「的」

來源

2011-12-28 18:34:36 gotofritz

謝謝你，這是完美的！ – 2011-12-28 18:48:59

謝謝，你不會介意一點點upvote然後，試圖在這裏得到一些代表:-) – gotofritz 2011-12-28 18:52:29

非常有用的謝謝你！ +1 – Alex 2015-03-03 20:53:14

如果您正在使用最新版本的jQuery，您可以使用on() function附加一個事件處理程序。

$('#hospitalDropDown').on('change', function() { 
    window.location.assign('http://mysite.com/events.aspx?hosp=' + $(this).val()); 
});

要看到這個動作：http://jsfiddle.net/73PEg/

來源

2011-12-28 18:38:13 nachito

值得關注的。對只因爲jQuery的1.7 – gotofritz 2011-12-28 18:42:11

工作出於好奇，使用.on vs $（'＃hospitalDropDown'）。change（）？有什麼好處？ – ryanulit 2011-12-28 18:46:35

.change（）是.bind（'change'）的快捷方式，它只附加到當前加載的DOM元素。從文檔：「.on（）方法將事件處理程序附加到jQuery對象中當前選定的元素集。從jQuery 1.7開始，.on（）方法提供了附加事件處理程序所需的全部功能。從較老的jQuery事件方法，請參閱.bind（），.delegate（）和.live（）。「 – nachito 2011-12-28 18:50:17

傳遞下拉菜單選擇的值作爲查詢字符串URL

回答

相關問題