从 jQuery 的多选下拉列表中取消选择所有元素

Question

我有一个多选下拉列表，如下所示，我在其中选择了选项“测试 2”和“测试 3”。

<select id="edit-rec" class="form-select" multiple="multiple" name="rec[]">
<option value="6012">Test 1</option>
<option value="8436">Test 2</option>
<option value="4689">Test 3</option>
<option value="6784">Test 4</option>
</select>

我有一个名为“取消全选”的按钮。单击此按钮后，应取消选择所有选定的项目。在这种情况下，我之前选择的项目“测试 2”和“测试 3”现在应该被取消选择。

我怎样才能使用 jQuery 来完成这个任务？

Answer 1

$("#edit-rec option:selected").removeAttr("selected");

Answer 2

尝试 -

$("#edit-rec > option").attr("selected",false);

演示 - http://jsfiddle.net/LhSBu/

Answer 3

我发现取消选择多选下拉列表中所有选项的最简单方法是使用 .val([])。

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

Answer 4

单击单选按钮后，您可以使用它

$("#edit-rec  option").each(function(){

    this.selected=false;

});

Answer 5

它将从多选下拉列表中删除所有选中的选项：

$('#ddlTradeShow').multiselect("clearSelection");

Answer 6

$("#edit-rec option:selected").removeAttr("selected");

Answer 7

可以做类似 JS Fiddle 的事情来设置单选按钮的点击
http://jsfiddle.net/x5ck3/

$('#rdClear').click(

function() {
    $("#edit-rec option:selected").removeAttr("selected");
});

Answer 8

$("#butt").click(function () {
    $("#edit-rec > option").removeProp("selected");
});

新的 jQuery 版本是正确的

Answer 9

现在 API 直接提供了另一种可能性：

$('#edit-rec').multiSelect('deselect_all');

工作正常，在这里您可以找到有关它的更多选项：http://loudev.com /

Answer 10

您可以使用普通的 HTMLSelectElement DOM 界面，并且也无需迭代所有 元素。可以使用 selectedIndex 或 value：

$('#edit-rec')[0].selectedIndex = -1;

或者：

$('#edit-rec')[0].value = '';

无论 multiple 属性如何，它们都可以工作。有关各种方法的示例，请参阅此小提琴。

---

PS：对于多个元素，您可以使用 jQuery 的 .each （但要小心从回调中返回非 false），或 DOM 集合的 .forEach （返回值无关紧要） ：

$('.all-the-selects').each((_,s) => s.selectedIndex = -1);

或者：

$('.all-the-selects').get().forEach(s => s.selectedIndex = -1);