引导日期选择器不选择一个日期后自动关闭

问题描述 投票:19回答:11

我用的是最新的引导datepicker.js。所不同的是,当我选择一个日期从下拉,它不会自动关闭这一切工作正常。我搜索网页,并试图使用下面的函数在我的javascript如下所示:

 $('#selectDate').datepicker({
    autoclose: true
}).on('changeDate', function (ev) {
    (ev.viewMode == 'days') ? $(this).datepicker('hide') : '';      
});

但是当我使用谷歌Chrome浏览器开发工具,我意识到ev.viewmode是不确定的。我不知道如何前进。

javascript jquery twitter-bootstrap datepicker
11个回答
21
投票

尝试这个:

$('#selectDate').datepicker()
.on('changeDate', function(ev){                 
    $('#selectDate').datepicker('hide');
});

更新:

当您使用日期选择器目前在GitHub上的更新版本autoclose正常工作:

https://github.com/eternicode/bootstrap-datepicker


0
投票

这是为我工作。

$(".date-picker").datepicker( {
    format: "yyyy-mm-dd",
}).on('change', function (ev) {
    $(this).datepicker('hide');
});

-1
投票

这为我工作

$(".date-picker").change(function() { 
    setTimeout(function() {
        $(".date-picker").datepicker('hide'); 
        $(".date-picker").blur();
    }, 50);
});    

16
投票

我加了自动关闭:真,(半末处的逗号和它的作品)

 $('.datepicker').datepicker({
    format: 'dd/mm/yyyy',
    todayHighlight:'TRUE',
    autoclose: true,
})

11
投票

为我工作,但重写日期选择默认选项以上都不对工作就像一个魅力,是一个班轮:

$.fn.datepicker.defaults.autoclose = true;

9
投票

尝试这个:

$('#selectDate').datepicker().on('changeDate', function(ev)
{                 
     $('.datepicker').hide();
});

7
投票

如果你对你已申请日期选择多个文本框,然后旧的解决方案可能会导致问题,请改为试试这个,

$('.datepicker').datepicker({
     format: "dd/mm/yyyy",
     autoclose: true,
}).on('changeDate', function (ev) {
     $(this).datepicker('hide');
});

看出来这一点,https://github.com/eternicode/bootstrap-datepicker/issues/500

注意:不要忘了,我们正在使用jQuery的类选择,所以你需要日期选择器类应用到您的文本框中。


3
投票
  1. 只需打开引导,datepicker.js
  2. 发现:VAR默认值= $ .fn.datepicker.defaults(在我的案件1391线)
  3. 设置自动关闭:真

保存并刷新你的项目,这应该做的。


2
投票

对于我来说竟然是引导,日期选择文档中的拼写错误。相反,“自动关闭:真”的,它的“自动关闭:真”。

希望能帮助到你。


0
投票

// 10000%的工作去引导,datepicker.js文件

搜索这样的:

'mousedown touchstart': $.proxy(function(e){
                    // Clicked outside the datepicker, hide it
                    if (!(
                        this.element.is(e.target) ||
                        this.element.find(e.target).length ||
                        this.picker.is(e.target) ||
                        this.picker.find(e.target).length
                    )) {
                        this.hide();  //remove this
                    }
                }, this)
            }]
        ];
    },

0
投票

当你将鼠标悬停在与类默认的日期选择器的股利。日历控件将出现。在鼠标离开它会消失。

 $(document).on("focus", ".defaultdatepicker", function () {

        $(this).datepicker({
            format: 'dd/mm/yyyy',
            todayHighlight: 'TRUE',
            autoClose: true,
        });

        $('#datepicker').css({ "opacity": "1" });
    });

    $('.defaultdatepicker').on('mouseleave', function () {
        $('.datepicker').fadeOut(function () {
            $('.formattedStartDate').attr('class', 'formattedStartDate');

            $('#datepicker').css({ "opacity": "0" });
        });
    });
© www.soinside.com 2019 - 2024. All rights reserved.