jquery-select2 相关问题

Vue条件渲染

我正在使用 Vuejs。我有一个带有多个 select 和 select2 类的选择输入。 1

为什么 Select 2 jquery 插件不能在 Bootstrap 模式中工作？但它在页面的任何部分都可以正常工作，超出 modal

$（文档）.ready（函数（）{ $('.js-example-basic-single').select2(); dropdownParent: $('#exampleModal') }); ... $(document).ready(function() { $('.js-example-basic-single').select2(); dropdownParent: $('#exampleModal') }); <div class="container text-center"> <div class="row"> <div class="col-sm"></div> <div class="col-sm"> <div class="card text-center"> <div class="card-header"> </div> <div class="card-body"> <select class="form-select js-example-basic-single" aria-label="Default select example"> <option selected>--select--</option> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> <!-- Button trigger modal --> <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal"> inside modal </button> <!-- Modal --> <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <select class="form-select js-example-basic-single" aria-label="Default select example"> <option selected>--select--</option> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> </div> <div class="modal-footer"> </div> </div> </div> </div> </div> <div class="card-footer text-muted"> </div> </div> </div> <div class="col-sm"></div> </div> </div> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script> 我正在尝试在 Bootstrap 模式中运行 Select 2 jquery 插件，但它在模式内部不起作用，只能在模式范围之外工作。我已经从该站点尝试了许多解决当前相同问题的方法，但是所有方法都没有用。请帮助我 $(document).ready(function() { $('.js-example-basic-single').select2({dropdownParent: $('#exampleModal')}); }); <div class="container text-center"> <div class="row"> <div class="col-sm"></div> <div class="col-sm"> <div class="card text-center"> <div class="card-header"> </div> <div class="card-body"> <select class="form-select js-example-basic-single" aria-label="Default select example"> <option selected>--select--</option> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> <!-- Button trigger modal --> <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal"> inside modal </button> <!-- Modal --> <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <select class="form-select js-example-basic-single" aria-label="Default select example"> <option selected>--select--</option> <option value="1">One</option> <option value="2">Two</option> <option value="3">Three</option> </select> </div> <div class="modal-footer"> </div> </div> </div> </div> </div> <div class="card-footer text-muted"> </div> </div> </div> <div class="col-sm"></div> </div> </div> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>

使用浏览器后退按钮后，Select2 下拉菜单不起作用

我目前正在开发一个包含多个 Select2 下拉菜单的搜索页面。下拉列表在第一页加载时效果很好，但只有当有人搜索然后点击 b 时才会出现问题...

如何将按钮放入 select2 结果项并处理其点击？

我正在尝试将一个按钮放入 select2 结果项中（以允许用户删除项）。我设法放置了按钮，但我还没有设法处理它们的点击事件。不知何故事件

Select2 消失，添加动态形式后

我有一个关于 select2 的问题，发生的事情是我有一个几乎没有 select2 的动态表单，但是每次我单击 addNewItembtn 之前的字段的 select2 功能都会消失。 这是...

将 select2 附加到新元素

请告诉我如何将 select2 处理程序连接到追加或加载的新元素。 $(".js-example-basic-single").select2(); $(文档).ready(函数() { $("body").append(' 请告诉我如何将 select2 处理程序连接到追加或加载的新元素。 $(".js-example-basic-single").select2(); $(document).ready(function() { $("body").append('<select class="js-example-basic-single"><option>1</option><option>2</option><option>3</option></select>'); }) select { width: 100px; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script> <body> </body>

如何使用 jquery 向 select2 <select> 添加更多选项？

我遇到了同样的挑战，我发现官方 select2 文档非常有用。 我试过这个 $('#selectBox').append($('').val(optionValue).text(optionText)) 但它是自动选择...

制表符和 select2 标题过滤器

堆栈： 红宝石 - 2.7.6 导轨 - 6.1.5 制表符 - 5.4.3 jquery-rails gem - 4.4.0 jquery-ui-rails gem - 6.0.1 select2-rails gem - 3.5.11 启用我们定制的和已经建立的 select2 fie ...

将 select2 多选样式更改为 selectpicker

在 select2 插件中，多个选择附加到下一行，直接放大容器元素，如第一张图片所示，而在 bootstrap-select 中，多个选择在

Select2点击后有叠加效果的下拉菜单

我想自定义使用“Select2”库创建的下拉菜单。 我试图在菜单打开时创建叠加效果，但我失败了。 有没有人可以帮助我？ 谢谢 我要……

溢出：自动的div内select2的滚动条问题

我正在编写一个大的表单，为了避免一个巨大的滚动条，我把它划分并嵌套到带有溢出：自动的div中。这样，我就可以把我的表单扩展成几个窗口，每个窗口都有固定的高度和 ...

JQuery Select2 width=100%在加载时产生 "flash"，如何防止？

我有一个JQuery Select2的HTML页面，里面有相当多的内容。 s. 这真的很好用。然而，在最初的0.5-1秒左右，它显示mySelectBox和mySelectBox2相继......。

如何解决select2的占位符在文档准备时被截断的问题？

我已经创建了一个多重选择在文档准备与jQuery（.select2（）函数）。选择工作良好，它已被正确地创建，但占位符只显示几个字符。当我把...

更改查询字符串，允许多个值

我的查询字符串有一个问题，问题是当选择多个值时，我的Django搜索中断。我在URL中得到了这样的结果：Query=value1&Query=Value2。在这种情况下，它只是......。

jQuery Select2 - 从原始选项的选择中获取样式属性。

以下是我的HTML代码： 选项1

Vue.js无法获取jQuery select2的值。

我在这里遇到了一个问题，我使用vue js作为cdn，所以我不能安装npm和使用包，所以当我尝试使用jquery的select2插件时，问题就开始了，它正确地显示了选项值... ...

为什么一个jQuery插件会让我的自定义功能停止工作？

我想让我的下拉菜单(HTML选择)可以被搜索到，并且根据下拉菜单中的选择值，我想在一个文本区域中输入一些文本。在文本区域中添加文本的javascript代码 ...

选择2选项列表更大程度地隐藏在基金会模式中。

我在网站中使用select2，我已经意识到模态的问题。这是我用来启动select2字段的脚本：$(function() { $('#id_creator').djangoSelect2({ ...

在rails 6中使用select 2时出错。

我试图使用select2在rails 6的宝石select2-rails。我已经添加在gemfile创业板 "select2-rails "和运行捆绑和yarn添加select2和inport上.js require("select2")，但当我尝试... ...

用 "jQuery validation "和 "Select2 "显示和隐藏成功和错误，与 "bootstrap4 "一致 [重复]

不重复 以前的问题（关于这个主题）与答案都是4-5年前的，并且是指各自项目的旧版本。状态 在我使用的项目中。Bootstrap v4.4.1 jQuery validation ...