按鈕獲得選擇值，做一些

Question

<div class="selCont"> 
     <h2>pick an option</h2> 
     <select id="my-dropdown" name="my-dropdown"> 
      <option value="0">Please Select</option> 
      <option value="1">West</option> 
      <option value="2">Land</option> 
      <option value="3">Easter</option> 
      <option value="4">Springtime</option> 
      <option value="5">Celtic</option> 
      <option value="6">Spectacular/</option> 
      <option value="7">Weekend</option> 
      <option value="8">Dark</option> 
      <option value="9">Treasures</option> 
     </select> 
     <button class="go-btn" type="submit"> 
     Go 
     </button> 
</div> 

所以基本上我希望能夠爲用戶選擇一個選項，並在命中Go按鈕，一個腳本運行，並期待在下拉列表中的值並使用該值將它們發送到相關頁面。

我一直在嘗試一些事情，但至今它並沒有很好地掛在一起。任何幫助一如既往的讚賞。

編輯

http://jsfiddle.net/TmfyC/ - 這裏是什麼就是什麼香港專業教育學院嘗試了最近從評論的一個幫助。

* 我用什麼人是誰可能受益 *

$('.go-btn').click(function() { 
    window.location = $('#my-dropdown').val(); 
}); 

這是我落得這樣做，那麼我指定的值作爲我的網頁的URL。似乎像一種享受。謝謝你們的幫助。

Answer 1

兩兩件事：http://jsfiddle.net/xSyF2/1/ORhttp://jsfiddle.net/xSyF2/

代碼

$('.go-btn').click(function() { 
    var selected = $('#my-dropdown option:selected'); 
    alert(" If you want text ==>" + selected.html()); 
});​ 

OR

$('.go-btn').click(function() { 
    alert(" If you just want value ==>" + $('#my-dropdown').val()); 
});​ 

Answer 2

​$('.go-btn').click(function() { 
    var selected = $('#my-dropdown option:selected'); 
    if (selected.length) { 
     // Do something with your selection 
     alert(selected.val()); 
    } 
});​​​​​​​​​​​​​​​​​​ 

Working JSFiddle

Answer 3

下面是一個例子，這將得到的值，將瀏覽器重定向到在查詢字符串中傳遞ID選擇其他網頁。

function doSomething() 
{ 
    var seleciton = parseInt($("#my-dropdown").val()); 

    if(isNaN(selection) || selection <= 0) // Additional verification 
    { 
     alert("Please select valid option."); 
     return; 
    } 

    window.location.href = 'http://somewhereelse.com/something?id=' + selection; 
} 

Answer 4

我想這應該夠了。

$(".go-btn").on('click',function(){ 
      alert($("#my-dropdown").val()); 
}); 

Answer 5

$('.go-btn').click(function(){ 
if($('#my-dropdown').val() == 0){ 
alert('Please select an option'); 
return false; 

} 
// do what you want here 
}); 

Answer 6

這裏是一個使用普通javascript而不是jquery的方法的一個簡單例子。

<script type="text/javascript"> 

    function goToProperPage() { 
     var url; 
     var location = document.getElementById("my-dropdown").selectedIndex; 
     if (location == 1) { 
      url = 'http://www.page.com/west'; 
     } 
     else if (location == 2) { 
      url = 'http://www.page.com/land'; 
     } 
     window.location.href=url; 
    } 

</script> 

<div class="selCont"> 
    <h2>pick an option</h2> 
    <select id="my-dropdown" name="my-dropdown"> 
     <option value="0">Please Select</option> 
     <option value="1">West</option> 
     <option value="2">Land</option> 
     <option value="3">Easter</option> 
     <option value="4">Springtime</option> 
     <option value="5">Celtic</option> 
     <option value="6">Spectacular/</option> 
     <option value="7">Weekend</option> 
     <option value="8">Dark</option> 
     <option value="9">Treasures</option> 
    </select> 
    <button class="go-btn" type="submit" onclick="javascript:goToProperPage();"> Go </button> 
</div>