Question

从第一个日期选择器中选择一个日期会导致＆＃34;关闭＆＃34;按钮从第二个日期选择器中消失。这是一个问题的小提琴：

在datepicker1的onSelect方法中设置datepicker2的minDate会导致问题。请帮忙！

HTML

<div id="datepicker1"></div>
<div id="datepicker2"></div>

JS

$('#datepicker1').datepicker({
        firstDay: 1,
        dateFormat: 'yy-mm-dd',
        showButtonPanel: true,
        currentText:"Close",
        onSelect: function(selectedDate) {
            $("#datepicker2").datepicker("option", "minDate", selectedDate);    
        }
});

$('#datepicker2').datepicker({
        firstDay: 1,
        dateFormat: 'yy-mm-dd',
        showButtonPanel: true,
        currentText:"Close",
});

Answer 1

如果您默认显示日期选择器，关闭按钮的用例是什么？使用输入而不是div有一个完成按钮，在完成时关闭日期选择器，这是有道理的。但是，如果无法关闭日期选择器，则关闭按钮似乎问题中缺少某些内容。

<input id="datepicker1"/>
<input id="datepicker2"/>

Fiddle

<强>更新

通过WebShim polyfill提供跨设备兼容性的更好解决方案：

包含以下脚本：

//cdnjs.cloudflare.com/ajax/libs/webshim/1.14.2/minified/extras/modernizr-custom.js
//cdnjs.cloudflare.com/ajax/libs/webshim/1.14.2/minified/polyfiller.js

同样添加：

    window.webshims.setOptions("forms-ext", {
        replaceUI: true,
        "date": {
            openOnMouseFocus: true,
            calculateWidth: false
        },
        "datetime-local": {
            openOnMouseFocus: true,
            calculateWidth: false
        },
        "number": {
            "classes": "hide-inputbtns"
        }
    });

    window.webshims.polyfill('forms forms-ext');

<强> FIDDLE

设置minDate时，jQuery UI内联日期选择器按钮消失

1 个答案: