jQuery 单击按钮获取选择值并执行某些操作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11686499/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
button on click get select value and do something
提问by Doidgey
<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>
So basically i want to be able for a user to select an option, and upon hitting the go button, for a script to run and look at the value of the dropdown and use the value to send them to the relevant page.
所以基本上我希望能够让用户选择一个选项，并在点击 go 按钮后，运行脚本并查看下拉列表的值并使用该值将它们发送到相关页面。
I've been trying a few things but as of yet it's not hanging together too well. Any help appreciated as always.
我一直在尝试一些东西，但到目前为止还没有很好地结合在一起。任何帮助一如既往地受到赞赏。
EDIT
编辑
http://jsfiddle.net/TmfyC/- Here is what is what ive tried most recently with the help from one of the comments.
http://jsfiddle.net/TmfyC/- 这是我最近在其中一条评论的帮助下尝试过的。
*WHAT I USED FOR PEOPLE WHO IT MIGHT BENEFIT*
*我为那些可能受益的人使用的东西*
$('.go-btn').click(function() {
window.location = $('#my-dropdown').val();
});
This is what i ended up doing, i then assigned the value as the url of my pages. Seems to work like a treat. Thanks for the help guys.
这就是我最终做的，然后我将值分配为我的页面的 url。似乎像款待一样工作。谢谢你们的帮助。
回答by Tats_innit
2 things : http://jsfiddle.net/xSyF2/1/ORhttp://jsfiddle.net/xSyF2/
2 件事：http: //jsfiddle.net/xSyF2/1/或http://jsfiddle.net/xSyF2/
code
代码
$('.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());
});?
回答by Michael Robinson
?$('.go-btn').click(function() {
var selected = $('#my-dropdown option:selected');
if (selected.length) {
// Do something with your selection
alert(selected.val());
}
});??????????????????
回答by Rolice
Here is an example, which will get the value and will redirect the browser to some other page with id selection passed in the query string.
这是一个示例，它将获取值并将浏览器重定向到其他页面，并在查询字符串中传递 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;
}
回答by Jeremy1026
Here is a quick example of a way to do it using normal javascript, not jquery.
这是一个使用普通 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>
回答by AdityaParab
I guess this should be enough.
我想这应该足够了。
$(".go-btn").on('click',function(){
alert($("#my-dropdown").val());
});
回答by coolguy
$('.go-btn').click(function(){
if($('#my-dropdown').val() == 0 ){
alert('Please select an option');
return false;
}
// do what you want here
});
