重置/取消选择选择选项 [英] Reset/Un-select Select Option

问题描述

用法:

我有一个具有选择下拉列表的表单，该下拉列表由另一个选择下拉列表控制.在加载页面时(如果之前选择了值，则PHP会加载它们)，选择下拉菜单2隐藏了几个选项(可行).使用选择下拉菜单#1选择特定选项时，选择下拉菜单#2隐藏的选项变为可用(.show()，此方法有效).

I have a form that has a select drop-down that's controlled by another select drop-down. On loading the page (if values where selected before, PHP loads them) select drop-down #2 hides several options (this works). When selecting a particular option with select drop-down #1, select drop-down #2 hidden options become available (.show(), this works).

问题:(概述问题的示例: http://jsfiddle.net/RqhbY/7/)

The problem: (An example to outline the problem: http://jsfiddle.net/RqhbY/7/)

当隐藏选项显示/可用并被选中时，然后选择下拉列表#1会更改该值，该值将隐藏下拉列表2中的选项，在提交时，将提交所选的隐藏值.

When the hidden options are shown/available and one is selected and then the select drop-down #1 changes that value that hides the options in drop-down #2, On submission the selected hidden value gets submitted.

如何取消选择/重置已隐藏的所选选项?

How can I un-select/reset the selected option that is now hidden?

推荐答案

http://jsfiddle.net/RqhbY /8/

尝试更改:

$('select[name=two[0]] option').attr('selected', false);

具有:

$('select[name=two[0]] option').removeAttr('selected');

更新

好的，我在IE 8中测试了上面的代码，并且仍然选择了禁用的<option>.但是，这似乎可行:

OK, I tested the above code in IE 8 and the disabled <option> is still selected. This seemed to work however:

$('select[name=two[0]]').children('option').removeAttr('selected').filter(':nth-child(1)').attr('selected', true);

演示: http://jsfiddle.net/RqhbY/9/

请注意，您可能希望将.filter()调用更新为仅选择未禁用的选项，但我会留给您.

Note that you may want to update the .filter() call to only select non-disabled options but I'll leave that for you.

更新

如果在<select>元素上调用.attr('selectedIndex', -1)，则不能选择任何<option>.下拉列表将不显示值，而是空白.

If you call .attr('selectedIndex', -1) on the <select> element then you can have no <option>s selected. The drop-down will not show a value but instead will be blank.

演示: http://jsfiddle.net/RqhbY/10/

这篇关于重置/取消选择选择选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！