javascript - 如何在 SweetAlert2 中将 Datepicker 置于最前面？

Question

我使用这些框架:

• > SweetAlert2
• > Date Picker from fengyuanchen

我想使用这两个框架来输入日期。我的问题是日期选择器在警报的背景中，也无法使用。
这个问题，你能在这个 fiddle 里找到吗:https://jsfiddle.net/vbfhtzf9/2/

<button>Click me!</button>
<script>
    $(document).ready(function() {
        $('button').click(function(){
            swal({
                html: '<input data-toggle="datepicker" type="text" id="#swal-input1" class="swal2-input">',
                        confirmButtonText: 'Next &rarr;',
                        showCancelButton: true,
                        onOpen: function() {
                            $('[data-toggle="datepicker"]').datepicker({
                                startView: 2,
                                autoHide: true,
                                inline: true,
                            });
                        },
            });
        });
    });
</script>

我的问题是，您是否知道将日期选择器置于最前面的 CSS 等技巧？

期待您的回答!

Answer 1

您需要将 datepicker 插件中的 z-index 设置为更大的数字。

                onOpen: function() {
                    $('[data-toggle="datepicker"]').datepicker({
                        startView: 2,
                        autoHide: true,
                        inline: true,
                        zIndex: 999999
                    });
                },

https://jsfiddle.net/2obeLhd8/1/