select2 jQuery插件：如何獲取列表的引用 <option>標簽替換？

Question

用下面的代碼

$('select.my-select').select2().on('select2:opening', function (event) {
  console.log(event, this);
});

所記錄的this是“原始的” <select> DOM元素。 但是，如何獲得其replacement / representation ？ 我說的是類select2-results__options的<ul> 。

我正在使用最新的select2 beta版本（當前是4.0.0 Beta 3）。 謝謝

Answer 1

如果我是正確的，則<li>s在<ul>在相同的順序作為<option>s在原<select> 。

因此，您可以選擇<ul>然后遍歷其子級並獲取相應的''。

試試這個：

$('select.my-select').select2().on('select2:opening', function (event) {
    var $select = $(this);
    $('.select2-results__options > li').each(function(i) {
        var option = $('option:nth-child('+i+')',$select);
        console.log($(option).val());
    });
});

附注：我現在無法測試，但是如果您提供小提琴，就可以對其進行測試。

或者，如果要對結果進行樣式設置，請嘗試以下方法（此代碼適用於select2 3.5.1，但我認為它也應適用於4.0）：

$('#myselect').select2({
    data: categories,
    allowClear: true,
    formatResultCssClass: function(obj) {
        if (obj.disabled) { return 'select2-item-cat-parent'; }
        else { return 'select2-item-cat'; }
    }
});