我使用以下框架:


SweetAlert2
Date Picker from fengyuanchen


我想同时使用两个框架输入日期。我的问题是日期选择器在警报的后台,并且也不可用。

您可以在这个小提琴中找到这个问题: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等技巧,以将Datepicker放在首位?

期待您的答复!

最佳答案

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

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


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

关于javascript - 如何将Datepicker带到SweetAlert2的最前面?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/47603044/

10-11 22:26