将选择值重置为默认值

一尘不染

将选择值重置为默认值

html

我有选择框

<select id="my_select">
    <option value="a">a</option>
    <option value="b" selected="selected">b</option>
    <option value="c">c</option>
</select>

<div id="reset">
    reset
</div>

我也有重置按钮，这里的默认（选定）值为“ b”，假设我选择了“ c”，并且在我需要重新设置选择框的默认值之后，如何使用jquery做到这一点？

$("#reset").on("click", function () {
    // What do here?
});

阅读 486

2020-05-10

共1个答案

一尘不染

您可以使用defaultSelectedoption元素的属性：

包含selectedHTML属性的初始值，指示该选项是否默认选中。

因此，DOM接口已经可以跟踪最初选择了哪个选项。

$("#reset").on("click", function () {
    $('#my_select option').prop('selected', function() {
        return this.defaultSelected;
    });
});

这甚至适用于多选元素。

如果您不想遍历所有选项，而是在找到最初选择的选项之后“中断”，则可以使用.each：

$('#my_select option').each(function () {
    if (this.defaultSelected) {
        this.selected = true;
        return false;
    }
});

没有jQuery：

var options = document.querySelectorAll('#my_select option');
for (var i = 0, l = options.length; i < l; i++) {
    options[i].selected = options[i].defaultSelected;
}

2020-05-10