Question

现在我正在使用Select2.js组合或放入Swiper.js，我也将它们都放在Bootstrap模式中。但问题是Select2 Js无法正常工作（下拉列表和过滤器文本文件不能正常工作），这里是我之前尝试过的代码：

Bootstrap：

<div class="modal fade" id="passModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">

                </div>
                <div class="modal-body">

                </div>
                <div class="modal-footer">

                </div>
            </div>
        </div>
    </div>

Swiper JS

var swiperpass = new Swiper('.content-pass', {
            pagination: {
                el: '.numb-pagination',
                type: 'fraction',
            },
            navigation: {
                nextEl: '.form-next',
                prevEl: '.form-prev',
            },
            spaceBetween: 30
        });

然后，在寻找一些解决方案之后，我在代码行中添加simulateTouch:false找到了一个小解决方案（下拉工作正常）：

var swiperpass = new Swiper('.content-pass', {
            pagination: {
                el: '.numb-pagination',
                type: 'fraction',
            },
            navigation: {
                nextEl: '.form-next',
                prevEl: '.form-prev',
            },
            spaceBetween: 30,
            simulateTouch:false
        });

但我仍有问题，过滤器文字字段仍然无效。

那么，我该怎么做才能使它正常工作。谢谢

Answer 1

对不起，这是我找到的解决方案：

<div class="modal fade" id="passModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">

            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>

只需删除tabindex="-1"，然后问题就解决了。

谢谢

Select2 Js在Swiper Js中不起作用

1 个答案: