仅允许在select2中选择一个optgroup中的1个选项

Question

我的目标是只允许从select2插件中选择一个optgroup中的1个选项。

请参见以下代码示例：https://jsfiddle.net/xpvt214o/554423/

我遇到的问题是这段代码：

$portSelect.on('select2:unselect', function (evt) {
  $portSelect.find('optgroup').each(function (gindex) {
    var $group = $(this);
    var selected = 0;

    $group.children().each(function (cindex) {
      if ($(this).prop('selected') === true) {
        selected++;
      }
    });

    if (selected != 0) {
      $group.children().removeAttr('disabled');
    }
  });

  $portSelect.select2('destroy').select2(select2options);
});

特别是$portSelect.select2('destroy').select2(select2options);行。注释此行可防止发生错误，但不会刷新select2选项...

当您选择一个选项，然后取消选择该选项时，会出现以下控制台错误：

Uncaught TypeError: Cannot read property 'query' of null