在 Chosen Select 中恢复预选值

Question

In the fiddle attached, I have two options pre-filled "Denmark" and "France", when the chosen select loads.如果我在 select 框中 select 更多值并单击清除按钮，我想使用相同的预填充值 "Denmark" 和 [= 恢复所选 select 22=].

我想更改此代码以预填充 selected 值。

$("#Clear").click(function () {
    $('.chosen-select option').prop('selected', false).trigger('chosen:updated');
});

JSFiddle

更新：如果有一种方法可以使预填充的选项无关紧要，但应该恢复它们（如果有的话），那就太好了。

Answer 1

您需要创建一个预选选项值数组。然后你可以使用这个数组的 forEach 循环来改变 selected 的值并在触发更新之前获得初始状态。

$("#countries").chosen();

let preselected = [];

$('[selected]').each((i, node) =>{
  preselected.push($(node).attr('value'));
});

$("#Clear").click(function () {
    $('.chosen-select option').prop('selected', false);

    preselected.forEach(pre => {
      $(".chosen-select option[value='" + pre + "']")
      .attr('selected', 'selected')
      .trigger('chosen:updated');
    });
});

Fiddle

如您所见，here 插件中没有任何内容可用于实现此目的，看来您必须通过更改 DOM 和触发更新来实现。我会使用 luckyape answer 和我的代码，将其混合。

Answer 2

试一试

$("#countries").chosen();

$("#Clear").click(function () {
    $('.chosen-select option').prop('selected', false);
    $('.chosen-select').val(['Denmark', 'France']).trigger('chosen:updated');
});

http://jsfiddle.net/y5cnd018/

在 Chosen Select 中恢复预选值

Restore pre-selected values in Chosen Select

jquery

jquery-chosen