jQuery 使用 Next 设置选定的选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1280369/
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
jQuery Set Selected Option Using Next
提问by DLS
How can I, using jQuery, set the "next" item of an already selected item as "selected."
我如何使用 jQuery 将已选择项目的“下一个”项目设置为“已选择”。
For example, if I have:
例如，如果我有：
<select>
<option value="1" >Number 1</option>
<option value="2" selected="selected">Number 2</option>
<option value="3" >Number 3</option>
<option value="4" >Number 4</option>
</select>
We can see that "Number 2" is selected, and using jQuery, I'd like to set "Number 3" as selected, and remove the selected "attribute" from "Number 2". I'm assuming I need to use the nextselector, but I'm not quite sure how to implement.
我们可以看到选择了“Number 2”，并且使用jQuery，我想将“Number 3”设置为选中状态，并从“Number 2”中删除所选的“属性”。我假设我需要使用下一个选择器，但我不太确定如何实现。
回答by GtotheB
Update:
更新：
As of jQuery 1.6+ you should use prop()instead of attr()in this case.
从 jQuery 1.6+ 开始，您应该在这种情况下使用prop()而不是attr()。
The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the .attr() method sometimes took property values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.
属性和特性之间的差异在特定情况下可能很重要。在 jQuery 1.6 之前，.attr() 方法在检索某些属性时有时会考虑属性值，这可能会导致不一致的行为。从 jQuery 1.6 开始， .prop() 方法提供了一种显式检索属性值的方法，而 .attr() 方法检索属性。
var theValue = "whatever";
$("#selectID").val( theValue ).prop('selected',true);
Original Answer:
原答案：
If you want to select by the value of the option, REGARDLESS of its position (this example assumes you have an ID for your select):
如果您想通过选项的值进行选择，无论其位置如何（本示例假设您有一个 ID 用于选择）：
var theValue = "whatever";
$("#selectID").val( theValue ).attr('selected',true);
You do not need to "unselect". That happens automatically when you select another.
您不需要“取消选择”。当您选择另一个时，这会自动发生。
回答by DLS
$('option:selected', 'select').removeAttr('selected').next('option').attr('selected', 'selected');
Check out working code here http://jsbin.com/ipewe/edit
在此处查看工作代码 http://jsbin.com/ipewe/edit
回答by Can Ho
From version 1.6.1 on, it's advisable to use the method prop for boolean attributes/properties such as selected, readonly, enabled,...
从版本 1.6.1 开始，建议将方法 prop 用于布尔属性/属性，例如 selected、readonly、enabled...
var theValue = "whatever";
$("#selectID").val( theValue ).prop('selected',true);
For more info, please refer to to http://blog.jquery.com/2011/05/12/jquery-1-6-1-released/
更多信息请参考http://blog.jquery.com/2011/05/12/jquery-1-6-1-released/
回答by Kobi
you can use
您可以使用
$('option:selected').next('option')
or
或者
$('option:selected + option')
And set the value:
并设置值：
var nextVal = $('option:selected + option').val();
$('select').val(nextVal);
回答by Racky
And if you want to specify select's ID:
如果要指定 select 的 ID：
$("#nextPageLink").click(function(){
$('#myselect option:selected').next('option').attr('selected', 'selected');
$("#myselect").change();
});
If you click on item with id "nextPageLink", next option will be selected and onChange() event will be called. It may look like this:
如果您单击 ID 为“nextPageLink”的项目，将选择下一个选项并调用 onChange() 事件。它可能看起来像这样：
$("#myselect").change(function(){
$('#myDivId').load(window.location.pathname,{myvalue:$("select#myselect").val()});
});
OnChange() event uses Ajax to load something into specified div.
OnChange() 事件使用 Ajax 将某些内容加载到指定的 div 中。
window.location.pathname = actual address
window.location.pathname = 实际地址
OnChange() event is defined because it allowes you to change value not only using netx/prev button, but directly using standard selection. If value is changed, page does somethig automatically.
定义 OnChange() 事件是因为它不仅允许您使用 netx/prev 按钮更改值，还可以直接使用标准选择更改值。如果值改变，页面会自动做一些事情。
回答by Andy
This is what i just used, i like how clean it is :-)
这是我刚用的，我喜欢它的干净程度:-)
$('select').val(function(){
var nextOption = $(this).children(':selected').next();
return $(nextOption).val();
}).change();
回答by Memonic
$('your_select option:selected').next('option').prop('selected', true)
回答by Krishna Murthy
$('#my_sel').val($('#my_sel option:selected').next().val());
$('#my_sel').val($('#my_sel option:selected').prev().val());
回答by zloctb
$("select").prop("selectedIndex",$("select").prop("selectedIndex")+1)
回答by Vins
Find the row, then
找到行，然后
var row = $('#yourTable');
the value you want to select
您要选择的值
var theValue = "5";
row.find("select:eq(2)").find("option[value="+theValue+']').attr('selected','selected');
