Javascript 如何关闭<；更改时的日期选择器；输入类型="；日期“/&燃气轮机；HTML5输入日期元素

我有一个HTML5

字段，我想立即响应更改的日期

目前，输入字段部分掩盖了日期更改时更改的数据，因此我更喜欢在日期更改后自动关闭日历选择器

我已经尝试在更改时使用.blur（），但这没有任何效果。事件激发，我可以获得新的日期值，但日期选择器没有隐藏。欢迎提出任何建议

  .bind('change', function(){
    var input = $(this);
    if(input.is(':valid'))
    {
      input.blur();
    }
  });

[更新]

到目前为止，我还求助于在页面上添加一个额外的输入元素（

），而不是

input.blur（）

执行

$（'hideMyCalendar'）.focus（）但这也不会隐藏选择器，即使焦点在视觉上被带到了另一个控件。到目前为止，我认为，唯一可能的方法是调用特定于chrome（webkit）的方法，但我还没有找到这样一种方法（至今）。
试试这个：

$( ".selector" ).datepicker( "hide" );

参考：

因此，我更喜欢在日期更改后自动关闭日历选择器

HTML5
input type=“date”
未指定浏览器应如何实现此输入。它可以是一个图形化的日期选择器，也可以是对用户输入的简单验证——不管浏览器供应商想要实现什么

因此，以跨浏览器的方式隐藏实际上依赖于浏览器的“日期选择器”是不可能的

但是，您可以使用，在那里您可以完全控制它的显示和隐藏方式。
01/30/14这不再有效

这很难看，但它适用于Chrome

这是我在选择日期后关闭html5日期的唯一方法。
只需删除date属性，然后再次应用它。
该值被保留，看起来就像是手动关闭的

更新：

这是我用来关闭所有日期类型的方法，如下所示：

$(document).ready(function () {
    //make all date html5 close on change in chrome
    $('input[type="date"]').change(function () {
        closeDate(this);
    });

});

function closeDate(dateInput) {
    $(dateInput).attr('type', 'text');
    $(dateInput).attr('type', 'date');
}

你（用英语）说：

我更喜欢HTML5输入元素，因为我希望这能给网络带来统一

你还愿意称之为webkit特定的方法吗？（in）：

到目前为止，我认为，唯一可能的方法是调用一个特定于chrome（webkit）的方法，但我还没有找到这样一个方法

我认为这违背了目的。然后你需要一个特定于Opera的方法，一个特定于IE的方法，一个特定于Firefox的方法等等。。。网络不再统一

如果你真的想要一个跨浏览器的单用户体验，那就试试吧。它不仅为您提供了做您想做的事情的多功能性（as），还为您提供了跨异构浏览器的相同行为


而不是在可用的地方使用HTML5。当JavaScript不可用时，您需要做的是回到HTML5。那就是使用。事实上，jQuery在默认情况下就是这样设计的

只需创建HTML5（与HTML4兼容）字段：

注：+1至零


我知道我没有回答这个问题，但这解决了问题。
不确定你使用的是什么日期选择器。运行一次，用firebug检查。获取id、类或它拥有的任何属性。并在更改日期时用javascript隐藏它。它只是日期类型的本机HTML5输入控件；我目前测试的浏览器是Chrome，我没有使用jQuery日期选择器；这是HTML5日期输入元素。我有一个不同的日期选择器用于非HTML5兼容的浏览器，但我更喜欢HTML5输入元素，因为我希望这能为web带来统一。这在我使用的Chrome 31.0.1650.57中不起作用。开发工具抛出一个错误，表示无法更改元素的类型。我使用的是相同的版本，无法复制该错误。我发布了我实际使用的代码。你能试试看它是否有效吗？你是对的，Thomas，它在jQuery1.10.2中有效。然而，在1.8.3中，我并不局限于我正在工作的站点。很高兴您跟进了这一点。它在jQuery1.10.2和2.0.3中工作。但是，版本1.8.3或1.9.2中没有。很高兴知道。我不认为我会在公共站点上实际使用此代码，因为它非常具体，而且感觉很粗略。jquery日期选择器，然后。。。
$(document).ready(function () {
    //make all date html5 close on change in chrome
    $('input[type="date"]').change(function () {
        closeDate(this);
    });

});

function closeDate(dateInput) {
    $(dateInput).attr('type', 'text');
    $(dateInput).attr('type', 'date');
}

<input type="date" name="date" id="date" value="" />

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js></script>  
<script type="text/javascript" src="js/jquery-ui.js"></script>

<script type="text/javascript">
    $('#date').datepicker();   
</script>

$( ".selector" ).datepicker( "hide" );