在 jQuery 中取消选择 < select > 的最佳方法是什么？

小开

$(option).removeAttr('selected') //replace 'option' with selected option's selector

小开

一个快速谷歌找到这篇文章，它描述了如何在IE中为单个和多个选择列表做你想做的事情。解决方案似乎也很优雅:

$('#clickme').click(function() {
$('#selectmenu option').attr('selected', false);


});

小开

最佳答案

使用removeAttr……

$("option:selected").removeAttr("selected");

或道具

$("option:selected").prop("selected", false)

小开

$("option:selected").attr("selected", false);

小开

到目前为止，答案只适用于IE6/7中的多项选择;对于更常见的非多选择，您需要使用:

$("#selectID").attr('selectedIndex', '-1');

这在flyfishr64链接的帖子中有解释。如果你仔细看，你会发现有两种情况——多/非多。没有什么能阻止你为了一个完整的解决方案而改变两者:

$("#selectID").attr('selectedIndex', '-1').find("option:selected").removeAttr("selected");

小开

非常感谢你的解决方案。

单选组合列表的解决方案非常有效。这是我在很多网站上搜索后发现的。

$("#selectID").attr('selectedIndex', '-1').children("option:selected").removeAttr("selected");

小开

这个问题已经问了一段时间了，我还没有在旧的浏览器上测试过，但在我看来，一个更简单的答案是

$("#selectID").val([]);

.val()也适用于select http://api.jquery.com/val/

小开

这里有很多答案，但不幸的是，所有的答案都很旧，因此依赖attr/removeAttr，这真的不是正确的方法。

@coffeeyesplease正确地提到了一个好的、跨浏览器的解决方案

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

另一个好的跨浏览器解决方案是

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

你可以看到它运行了一个自我测试在这里。在IE 7/8/9, FF 11, Chrome 19上测试。

小开

$("#selectID option:selected").each(function(){
$(this).removeAttr("selected");
});

这将遍历每个项目，只取消选中的项目

小开

通常当我使用选择菜单时，每个选项都有一个与之相关的值。例如< / p >

<select id="nfl">
<option value="Bears Still...">Chicago Bears</option>
<option selected="selected" value="Go Pack">Green Bay Packers</option>
</select>
console.log($('#nfl').val()) logs "Go Pack" to the console
Set the value to an empty string $('#nfl').val("")
console.log($('#nfl').val()) logs "" to the console

现在，这并没有从选项中删除选中的属性，但我真正想要的是值。

小开

哦,jquery。

既然还没有原生的javascript方法，我觉得有必要提供一个。

var select = document.querySelector('select'); //hopefully you'll use a better selector query
select.selectedIndex = 0; // or -1, 0 sets it to first option, -1 selects no options

为了告诉你这有多快基准

小开

简单的方法

`$('select').val('')`

我只是在select本身上使用了这个，它做到了。

我在jQuery 1.7.1上。

小开

另一种简单的方法:

$("#selectedID")[0].selectedIndex = -1

小开

$("#select_id option:selected").prop("selected", false);

小开

在你的选择中设置一个id，比如:
<select id="foo" size="2"> < / p >

那么你可以使用:
$("#foo").prop("selectedIndex", 0).change(); < / p >

小开

这个代码适用于我。

$("option:selected").prop("selected", false);