jquery删除选项的“选定”属性？答案

【问题标题】：jquery remove "selected" attribute of option?jquery删除选项的“选定”属性？
【发布时间】：2011-10-31 22:58:00
【问题描述】：

为什么在 IE8 中取消选择多行选择框中的所有选项不起作用？

$("#myselect").children().removeAttr("selected");

有解决方法吗？我想不到的任何东西（attr("selected","") 等）似乎都行不通。

更新：Here is an updated jsFiddle.我至少让它降级，以便在 IE8 中选择第一个选项。但是如果没有硬编码的 selected='selected' 和 IE8 似乎需要的 .attr 调用，它在 Firefox、Chrome 和 IE8 中做了 3 种不同的事情！ See this version:，这很简单，看起来应该可以工作：

在 Firefox 中：未选择任何内容
在 Chrome 中：选择了第 0 个选项
在 IE8 中：选择了第一个选项

也许我把自己弄疯了，在我看不到的地方有错误？

【问题讨论】：

我遇到了和唐一样的问题。但是，“选择第一项”解决方法不适合我的使用。 Gabe 的解决方案不起作用。这是 gabe 更新的 jsFiddle 不起作用。 jsfiddle.net/UFk5w/36。 stackoverflow.com/questions/1857781/… 中给出的答案也不起作用。赏金值得一个有效的答案。

标签： jquery internet-explorer

【解决方案1】：

以误导的方式提出问题。 “删除selected 属性”和“取消选择所有选项”是完全不同的事情。

要以文档化的跨浏览器方式取消选择所有选项，请使用任一

$("select").val([]);

或

// Note the use of .prop instead of .attr
$("select option").prop("selected", false);

【讨论】：

有趣的是上面的#2在这里似乎不起作用：stackoverflow.com/questions/58297515/…
@mplungjan 我不确定您提供的链接到底是什么不起作用，但该问题中的代码使用attr 而不是prop，正如解释的那样，这是错误的。

【解决方案2】：

这行得通：

$("#myselect").find('option').removeAttr("selected");

或

$("#myselect").find('option:selected').removeAttr("selected");

jsFiddle

【讨论】：

我更喜欢：$("#myselect").find('option:selected').removeAttr("selected");。并不是说你有世界上的差异；）
有区别。第一个尝试从所有option 元素中删除selected 属性。第二个过滤掉所有实际具有selected 属性的选项元素，然后将其从那些元素中删除。
谢谢！但这对我不起作用。我更新了小提琴以从我的真实示例中添加一些其他内容。 jsfiddle.net/UFk5w/4 在 Chrome+FF 中效果很好，但在 IE8 中，value=1 的选项被选中。

【解决方案3】：

这是 jQuery 转换为 IE8 的方式，不一定是浏览器本身。

我能够通过老学校和打破 jQuery 的一行来解决问题：

document.getElementById('myselect').selectedIndex = -1;

【讨论】：

我喜欢！谢谢。我不得不部署我的 hacky 东西，但我想我会回去重构。
使用selectedIndex 对我来说是最好的方法，但我使用了prop，就像这样：obj.prop('selectedIndex', -1);。由于我也在使用 bootstrap-select，为了完成这项工作，我也必须在设置属性后进行刷新 - obj.selectpicker("refresh")。

【解决方案4】：

使用 jQuery 1.9 及以上版本：

$("#mySelect :selected").prop('selected', false);

【讨论】：

【解决方案5】：

类似于@radiak 的响应，但使用 jQuery（请参阅this API document 并评论如何更改selectedIndex）。

$('#mySelectParent').find("select").prop("selectedIndex",-1);

这种方法的好处是：

您可以留在 jQuery 中
您可以使用 jQuery 选择器限制范围（示例中为#mySelectParent）
更明确定义的代码
适用于 IE8、Chrome、FF

【讨论】：

【解决方案6】：

另一种选择：

$('option:selected', $('#mySelectParent')).removeAttr("selected");

希望对你有帮助

【讨论】：

这对我有所帮助，但略有不同:) $("#myselect option:selected").removeAttr("selected");

【解决方案7】：

嗯，我在这个问题上花了很多时间。为了得到使用 Chrome 和 IE 的答案，我不得不改变我的方法。这个想法是避免删除选定的选项（因为无法使用 IE 正确删除它）。 => 这意味着不是通过在选项上添加或设置 selected 属性来选择选项，而是使用 selectedIndex 属性在“选择”级别选择一个选项。

之前：

$('#myselect option:contains("value")').attr('selected','selected');
$('#myselect option:contains("value")').removeAttr('selected'); => KO with IE

之后：

$('#myselect').prop('selectedIndex', $('#myselect option:contains("value")').index());
$('#myselect').prop('selectedIndex','-1'); => OK with all browsers

希望对你有帮助

【讨论】：