jQuery UI Datepicker - 爲什麼第二個datepicker消失onfocus？

我有兩個input元素作爲jQuery UI日期選擇器。在第一個datepicker元素上進行選擇後，它應該自動將焦點放在第二個datepicker元素上並顯示日曆，以便您輕鬆快速地進行選擇。jQuery UI Datepicker - 爲什麼第二個datepicker消失onfocus？

無論出於何種原因，第二個日期選擇器/日曆顯示一會兒然後消失。我不確定它爲什麼會消失;任何人都可以給我一個解釋，爲什麼它正在消失，並有可能的解決方案？

目前利用以下庫：jQuery的1.8.3，jQuery UI的1.9.2

這裏是我目前使用的代碼：

<ul class="fields"> 
    <li><label>Date picker #1</label> 
     <input type="text" class="date-picker-1" /> 
    </li> 
    <li><label> Date picker #2</label> 
     <input type="text" class="date-picker-2" /> 
    </li> 
</ul> 

$('input.date-picker-1').datepicker({ 
    constrainInput: true, 
    hideIfNoPrevNext: true, 
    onSelect: function() { 
     $(this).closest('.fields') 
      .find('.date-picker-2').datepicker('show'); 
    } 
}); 

$('input.date-picker-2').datepicker({ 
    onFocus: 'show' 
});

這裏有一個小提琴：http://jsfiddle.net/B78JJ/

如果任何其他信息將有所幫助，請隨時問，我很樂意提供幫助。

來源

2013-04-20 kyle.stearns

這似乎是一個重點計時問題，快速解決方法是使用一個小的超時：

$('input.date-picker-1').datepicker({ 
    constrainInput: true, 
    hideIfNoPrevNext: true, 
    onSelect: function() { 
     var dees = $(this); 
     setTimeout(function() { 
      dees.closest('.fields').find('.date-picker-2').datepicker('show'); 
     }, 100); 
    } 
});

見working fiddle

來源

2013-04-20 16:55:03 Nelson

這對IE，Chrome，Firefox和Safari適用於我。謝謝尼爾森。你知道這是「聚焦」事件的常見問題嗎？ – 2013-04-20 16:59:41

這可能是jquery-ui datepicker代碼中的一些bug/corner情況，它需要花費一些時間來調試datepicker才能找到確切的bug，所以如果你不想花時間在那，那麼超時解決方法是輕鬆的前進方向。 – Nelson 2013-04-20 17:07:28

這就是我要繼續使用。我會在一段時間內嘗試找出錯誤，但現在必須趕上截止日期！感謝您的解決方案。 – 2013-04-20 17:11:05

因爲這

$(this).closest('.fields') 
      .find('.date-picker-2').datepicker('show');

，你可以用

window.setTimeout(function(){ 
      $('.date-picker-2').datepicker('show'); 
     }, 1);

來源

2013-04-20 16:52:03 PSR

爲什麼會該特定的代碼導致問題？ – 2013-04-20 16:56:02

我們需要在一段時間後打開它 – PSR 2013-04-20 16:56:45

它是焦點時間問題 – PSR 2013-04-20 17:00:39

jQuery UI Datepicker - 爲什麼第二個datepicker消失onfocus？

回答

相關問題