Select 添加新选项时选项消失

Question

我目前正在为 select 创建一个界面，双击一个 select 元素的选项，并将其附加到另一个 select 元素。

我遇到的问题是这样做时，它被添加并可见，但是所有其他选项在目标中消失 select，直到我单击该选项然后单击关闭。

您可以在此处查看实际效果：https://i.imgur.com/jSXoIAi.gifv

我目前的实现如下：

$('body').on('dblclick', '#availableColumnsSelect > option', function (e) {

        var option = $(this);

        //Add option to destination
        displayColumnsSelect.append($('<option>', { value: option.val(), text: option.val() }));

        //Remove option from source
        option.remove();


        //Sort the select options
        sortSelect("#displayColumnsSelect");


        var optionsAvailable = $("#availableColumnsSelect > option:not([disabled])").length;


        if (optionsAvailable == 0) {
            $("#noSelectedText").removeClass('hidden');
        }
        $("#noSelectedText").addClass('hidden');
});

底层 HTML 正在按照应有的方式构建。

有什么想法吗？

Answer 1

如前所述，问题出在 sortSelection 函数上。我不太清楚为什么，但无论如何我实际上不再需要这个功能了。

删除上述功能已解决问题:)

Select 添加新选项时选项消失

Select options disappearing when appending new option

html

javascript

jquery

select

option