javascript - Select2 在引导模式下不起作用
问题描述
我读了这个问题,但我没有从那里得到任何解决方案。
我的 Bootstrap 模态 HTML 如下所示
<div class="modal fade" id="modelId" role="dialog" aria-labelledby="modelTitleId" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="container-fluid">
<form role="form" action="task">
<div class="row">
<select class="js-example-basic-multiple" name="states[]" multiple="multiple">
<option value="example1">example1</option>
<option value="example2">example2</option>
<option value="example3">example3</option>
<option value="example4">example4</option>
<option value="example5">example5</option>
<option value="example6">example6</option>
</select>
我使用下面的代码添加了 select2 的 CSS 和 JS。
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.11/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.11/js/select2.min.js"></script>
我在我的 HTML 页面中使用下面的 JS 代码。
<script>
$(document).ready(function() {
$('.js-example-basic-multiple').select2({
placeholder: 'Select an option'
});
});
</script>
我正在使用下面的 jQuery 链接
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
但我得到如下输出
解决方案
初始化 select2 时尝试以下代码:
obj.select2({
dropdownParent:obj.parent(), /// HOLDER DIV - FOR Z-INDEX ISSUES
推荐阅读
- pandas - 合并每个数据框中值略有不同的列上的数据框
- python - 除非我在 Windows 中使用 cmd 提示符安装它们,否则找不到安装在我的虚拟环境中的软件包
- javascript - 使用 React 发出 HTTP POST 请求
- database - Cassandra 中的一个节点可靠吗?
- webpack - 为什么像 rollupjs 或 webpack 这样的打包工具会直接在 JS 中导入和注入 CSS 文件?
- google-cloud-platform - 将 GCP 函数设为公开 - IAM 政策更新失败
- java - 抽象类 getter 和 setter 用法
- sql - 两个字符之间的字符串/数字重复多次
- lisp - EVAL:未定义的函数。在 Common LISP 中用作参数
- sql - Oracle SQL - 如何将单个值连接到多值列?