Question

＆＃34;添加新＆＃34;按钮代码：

    $('#AddButton').on('click', function() {
               bootbox
            .dialog({
                title: 'Add Transfer Details',
                message: $('#userForm'),
                show: false // We will show it manually later
            })
            .on('shown.bs.modal', function() {
                $('#userForm')
                    .show();
            })
            .on('hide.bs.modal', function(e) {
                // Bootbox will remove the modal (including the body which contains the login form)
                // after hiding the modal
                // Therefor, we need to backup the form
                $('#userForm').hide().appendTo('body');
            })
            .modal('show');
    });

单击代码运行上方的按钮后，显示一个bootbox弹出窗口。我在这个模态中有datepicker。从datepicker中选择日期后，我的bootbox模式立即隐藏。请帮助解释为什么会发生这种情况。

我的日期选择代码：

    $('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('changeDate', function(e){
        $(this).datepicker('hide');
    });

更新：

Jsfiddle链接（我面临的这个问题）

https://jsfiddle.net/paramj/sww1dnvk/3/

Answer 1

你发布的问题是错的，你的模态没有被隐藏。它是模态上的输入类型文本字段。因为以下行

$(this).datepicker('hide');

替换

$('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('changeDate', function(e){
        $(this).datepicker('hide');
    });

与

$('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('change', function(){
        $('.datepicker').hide();
    });

因为当你使用'this'时它选择输入类型文本（'id = payDate'）字段作为文档元素并在其上应用jquery hide。

错误就在这里完成

 .on('hide.bs.modal', function(e) {
                // Bootbox will remove the modal (including the body which contains the login form)
                // after hiding the modal
                // Therefor, we need to backup the form
                $('#userForm').hide().appendTo('body');
            })

除去

$('#userForm').hide().appendTo('body');

所以生成的javascript代码段将是

$('#AddButton').on('click', function() {

            bootbox
                .dialog({
                    title: 'Add Transfer Details',
                    message: $('#userForm'),
                    show: true // We will show it manually later
                })
                .on('shown.bs.modal', function() {
                    $('#userForm')
                        .show();                             // Show the login form
                })
                .on('hide.bs.modal', function(e) {
                    // Bootbox will remove the modal (including the body which contains the login form)
                    // after hiding the modal
                    // Therefor, we need to backup the form

                })
                .modal('show');



        });
    $('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('change', function(){
        $('.datepicker').hide();
    });

从datepicker bootbox modal hide中选择日期后

1 个答案: