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

我有一个多选下拉列表，如下所示，其中我选择了选项测试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实现这一点？

试试-

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

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

---

演示-

可以使用类似于JS小提琴的方法设置单击单选按钮

---

对于新的jQuery版本来说，这是正确的，单击单选按钮就可以使用它

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

    this.selected=false;

});

---

它将从multiselect dropdownlist中删除所有选中的选项：

$‘ddlTradeShow’。多选

---

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

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

---

工作正常，您可以在这里找到更多选项：

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

---

你的代码看起来很好。但是您可以解释一下语法$edit rec>option$edit rec>option应该选择任何直接子元素的选项元素edit rec元素。请参阅-我建议删除>部分。在这种情况下，它没有意义，并且会导致作为的父项使用时出现意外行为。请为您的答案添加一些解释，以使其更易于阅读。虽然还没有阅读文档，但它起到了作用：最好使用$edit rec选项：selected.propselected，false；这是一个非常糟糕的主意，它将完全删除属性，一旦删除，就不能再次添加到元素中。使用.prop将这些属性改为false；非常好，谢谢！

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

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

    this.selected=false;

});

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

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