使用jQuery清空基于Choices库的下拉选择框

Choices库会生成独立的DOM结构替代原生select，直接操作原生元素或模拟点击按钮往往不生效，必须用它提供的官方API处理：

• 保存Choices实例（推荐方式）
  初始化下拉框时把实例存到变量里，后续直接调用方法：

// 初始化时保存实例
const citiesDropdown = new Choices('.cities-dd', {
  // 你的配置参数，比如placeholder、allowHTML等
});

// 需要清空选中值时调用
citiesDropdown.removeActiveItems();

• 直接获取已存在的实例
  如果之前没保存实例，可通过原生元素获取挂载的Choices实例：

document.querySelector('.cities-dd').choices.removeActiveItems();

• 同步原生select值（可选）
  调用removeActiveItems()后Choices会自动同步原生select的值，若有特殊需求可手动触发：

document.querySelector('.cities-dd').choices.removeActiveItems();
jQuery('.cities-dd').val('').trigger('change');

如果是自定义的移除按钮，直接在点击事件里调用上述API即可，无需模拟点击Choices自带的按钮。

内容的提问来源于stack exchange，提问作者Jesse McMullen-Crummey