弹出窗口中的 JqueryMobile 多个日期选择器在 IE 上不起作用答案

【问题标题】：JqueryMobile multiple datepicker in a popup doesn't work on IE弹出窗口中的 JqueryMobile 多个日期选择器在 IE 上不起作用
【发布时间】：2013-06-10 16:38:43
【问题描述】：

我在尝试在 Windows Phone 的 Internet Explorer 上的输入 type="date" 上使用 jQuery 移动日期选择器时遇到问题。

我使用 Modernizr 库加载日期选择器，如下所示：

Modernizr.load({
 test: Modernizr.inputtypes.date,
  nope: ["../datepicker/js/jquery-ui-1.10.3.custom.js", "../datepicker/js/localizations/jquery.ui.datepicker-fr.js"],
   callback: function () {                
    $("head").append("<link rel='stylesheet' type='text/css' href='../datepicker/css/jquery-ui-1.10.3.custom.css'/>");
    $("input[type=date]").datepicker({ minDate: "+0d" });
   }
});

如果浏览器无法处理它们，此代码会在我的代码中为每个输入 type=date 创建一个 datepicker 实例。它实际上工作正常！但是有一种情况我看不懂。

在我的应用程序中，我有一个 jQuery Mobile 弹出窗口（带有 data-role="popup" 的 div），其中包含两个输入 type="date"。当弹出窗口打开时，我的两个输入有自己的日期选择器，当输入获得焦点时打开。但是有问题。单击第一个日期输入，日期选择器会自行打开，我可以选择一个日期。然后我想选择第二个日期，日期选择器打开，然后，当我在这个日期选择器中选择一个日期时，焦点切换回第一个日期输入，打开第一个日期选择器并且没有在我的第二个日期选择器上选择任何日期。

我尝试在我的输入中为每个输入设置一个专用 id，并通过定位这些 id 创建日期选择器，但结果相同：/

希望你们能理解我所暴露的问题。我希望你能帮助我。

【问题讨论】：

你能在jsfiddle上重现这个案例吗？
我试图在 jsfiddle 上重现我的问题，但无法实现。在 js fiddle 上运行良好。所以问题出在我的代码中的其他地方。我会努力弄清楚的。
但它只发生在 IE 上，其他浏览器可以正常工作，对吧？
所有浏览器都可以正常工作。它在 IE 8 上也可以正常工作，但 IE 7、9、10 和移动版本不工作。我怀疑我正在加载的 js 文件 jquery-ui-1.10.3.custom.js 中有一些函数覆盖导致了这种情况。我现在尝试仅加载日期选择器元素，然后看看会发生什么。
这个fiddle 说明了问题。

标签： jquery jquery-ui internet-explorer jquery-mobile

【解决方案1】：

你可以试试 DateRange 方法吗？

http://jqueryui.com/datepicker/#date-range

【讨论】：

我在使用 DateRange 方法时遇到了同样的错误行为。