选择选项表单中的 jQuery 自动选择答案

【问题标题】：jQuery Auto Selection in a Select Options Form选择选项表单中的 jQuery 自动选择
【发布时间】：2021-10-29 03:54:21
【问题描述】：

我正在管理 2 个（多）带有选项的选择列表，其中左侧（ListAllUsers）正在从数据库查询中收集用户名，而右侧（SelectedUsers）默认为空。每次我单击 ListAllUsers 中的名称时，它都会将其传输到 SelectedUsers 中，并由表单提交。为了提交 SelectedUsers 列表中的数据，所有选项都需要具有“selected”属性。我已经在某种程度上解决了这个问题，但是我遇到了一个特殊的问题：当我尝试将所有用户从 SelectedUsers 中删除回 ListAllUsers 时，由于“forceSelect”这一事实，我似乎无法删除最后一个用户由于某种原因阻止我点击它，我不知道为什么，因为所有被删除的用户在被删除时也默认在此列表中被选中。

这是一个例子：

<select multiple="multiple" id='ListAllUsers' class="form-control">
              
                    <option class="content" value="1">1</option>
                    <option class="content" value="2">2</option>
                    <option class="content" value="3">3</option>
                    <option class="content" value="4">4</option>
            
            </select>

<select name="user_id[]" multiple="multiple" id='SelectedUsers' class="form-control">

                </select>


(function () {
$("#ListAllUsers").change(function (e) 
    {
        let selectedOpts = $("#ListAllUsers option:selected");
        if (selectedOpts.length == 0) 
        {
            e.preventDefault();
        }
        $("#SelectedUsers").append($(selectedOpts).clone().prop('selected', true));
        $(selectedOpts).remove();
            e.preventDefault();
    });

$("#SelectedUsers").change(function (e) 
{
    let selectedOpts = $("#SelectedUsers option:selected");
    let forceSelect  = $("#SelectedUsers option");
    if (selectedOpts.length == 0) 
    {
        e.preventDefault();
    }
    $("#ListAllUsers").append($(selectedOpts).clone().prop('selected', false));
    $(forceSelect).prop('selected', true)
    $(selectedOpts).remove();
        e.preventDefault();
});
})(jQuery);

感谢您的帮助！

【问题讨论】：

标签： jquery select option transfer

【解决方案1】：

好的，答案似乎比我想象的要容易。我刚刚将“更改”功能换成了“点击”功能，它开箱即用！此外，最后的 e.preventDefault() 是矫枉过正的，所以也可以！希望对和我有类似情况的人有所帮助！

【讨论】：