【问题标题】:How to check dropdown state of bootstrap datepicker?如何检查引导日期选择器的下拉状态?
【发布时间】:2017-08-17 23:00:43
【问题描述】:

我知道以下检查整个小部件的可见性,但有没有办法只检查下拉日历的可见性/状态?

$("#datePicker").datetimepicker().is(":visible") 

编辑:小部件按预期运行,并包含在仅设置格式和定位的模式中。

$('#datePicker').datetimepicker({
    format: 'MM/DD/YYYY',
    widgetPositioning: {
        horizontal: 'auto',
        vertical: 'top'
    }
});

日历下拉菜单打开/可见时的 HTML:

<div class="bootstrap-datetimepicker-widget dropdown-menu usetwentyfour top pull-right" style="display:block;">...</div>
<span class="input-group-addon toggleCalendar">
    <span class="glyphicon glyphicon-calendar">...</span>
</span>

【问题讨论】:

    标签: javascript jquery twitter-bootstrap datepicker datetimepicker


    【解决方案1】:

    如果您检查过代码,您会很容易找到一个选择器来定位下拉菜单。

    下次按 CTRL+SHIF+C ;)

    试试这个:

    console.log( "Dropdown visible: " + $(document).find(".datepicker-dropdown").is(":visible") );
    

    这是CodePen中的演示。




    编辑

    以前是用于 Bootstrap DatePicker...
    这是 BootStrap DateTimePicker 的相同答案。

    答案基本相同,只是目标日历的选择器不同。
    在这种情况下,这是.dropdown-menu

    console.log( "Dropdown visible: " + $(document).find(".dropdown-menu").is(":visible") );
    

    CodePen中的演示。

    【讨论】:

    • 使用您的语句查询文档将返回false,无论如何,使用容器或模式ID作为选择器返回undefined
    • 我了解如何使用检查器和您提出的解决方案,但它根本不起作用。我相信这是因为小部件包含在模式中。我最终使用了一种完全不同的方法,但仍然想知道如何查询打开状态,请参阅 EDIT。
    • 我编辑了。使用检查器,这是您必须找到的日历选择器。
    猜你喜欢
    • 1970-01-01
    • 2013-07-03
    • 2017-05-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-06-16
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多