JQuery：单击跨度标签时切换日期选择器答案

【问题标题】：JQuery: toggle date-picker in when clicked on a span tagJQuery：单击跨度标签时切换日期选择器
【发布时间】：2016-04-26 11:36:47
【问题描述】：

在这里，我正在尝试添加出生日期，但使用以下代码：

<script>
    $('#datepicker').focus(function() {
        $("#datepicker").datepicker();
    });
</script>

我无法关闭 jquery datepicker！这是我的html：

<div class="DOB">
            <span class="DOB" contenteditable="true" id="datepicker">25/09/1996</span>
            <hr />
            <span class="st">Date of birth</span>
        </div>

我不想让 JQuery 日期选择器一直出现在我的屏幕上！

请帮忙...

【问题讨论】：

在跨度上使用日期选择器的更好方法是here

标签： javascript jquery html jquery-ui datepicker

【解决方案1】：

你可以这样做

var show = 1;

$('#datepicker').focus(function() { 
if(show == 1)
{
    $( "#datepicker" ).datepicker("show");
    show = 0;
}
else
{
    $( "#datepicker" ).datepicker("hide");
    show = 1;
}
});

【讨论】：

或者您可以将其隐藏在 datepicker 元素失去焦点上
.datepicker('hide') 和 .datepicker('show') 不起作用！
它在我的项目中运行良好，如果有任何错误白色隐藏/显示，请告诉我

【解决方案2】：

我在其他网站上搜索过这个，它工作正常，除了我不能在几个月之间切换，或者如果我在没有选择日期的情况下关闭它，它会留下空白！...

<script>
    $(function() {

        $('#datepicker').click(function() {
            $(this).datepicker({
                onSelect: function(date) {
                    $(this).datepicker('destroy').html(date);
                }
            });
        });
        $('body').click(function(e) {
            if ($(e.target).closest('#datepicker').length == 0) {
                $('#datepicker').datepicker('destroy');
            }
        });
    });
</script>

这个肯定可以的，如果可以的话，求解决切换月份和空格问题的办法！

【讨论】：