如何程序化设置下拉框值并触发change事件？重置下拉框遇问题求助

1. 程序化设置下拉框值（重置到"All"选项） #

你需要将下拉框重置到value为null、显示文本为"All"的选项，但现有代码存在几个关键错误：

• selectedIndex:1 选中的是索引为1的选项（即"MHP"），而"All"是第一个选项，索引应为0
• val('1') 设置的value值不存在，目标选项的value是"null"
• 修改选中项的文本text('null')完全错误，这会把选中选项的显示内容改成"null"，而非选中原有"All"选项

正确实现方式 #

以下三种方法均可实现需求，任选其一即可：

方法一：通过val()直接匹配目标value

function overallClick(){
    $('#programname').val('null');
}

方法二：通过selectedIndex指定选项索引

function overallClick(){
    $('#programname').prop('selectedIndex', 0);
}

方法三：直接选中对应选项并设置选中状态

function overallClick(){
    $('#programname option[value="null"]').prop('selected', true);
}

2. 触发下拉框的change事件 #

在jQuery中，直接调用下拉框元素的change()方法即可触发绑定的onchange事件（即你代码里的dropdownClick()）。通常会和设置值的操作结合，链式调用更简洁：

function overallClick(){
    // 设置值后立即触发change事件
    $('#programname').val('null').change();
}

如果需要分开执行，也可以写成：

function overallClick(){
    $('#programname').val('null');
    $('#programname').change();
}

内容的提问来源于stack exchange，提问作者dhS